Questions Tagged javascript
calendar resource view - possible to filter column ?
Answered: The latest DayPilot Pro version now supports column filtering API. See the following tutorial: https://code.daypilot.org/25430/javascript-resource-calendar-column-filtering You'll need version 2018.3...
Scheduler + Calendar break rowMoveHandling on Firefox
Hi, I think I have found a bug! If you have the Scheduler and the Calendar directives in the same page, it seems that the rowMoveHandling option stop to work for the Scheduler directive. This strange...
How to make an event style as selected on mouse click?
Answered: You can change the event background color using onEventClick event handler:
dp.onEventClick = function(args) {
var e = args.e;
e.data.backColor = "blue";
dp.events.update(e);
};
There i...
Drag drop users to the Daypilot calendar event
Hi, I want to drag and drop resource (i.e. User) to the event of daypilot calendar, Is there any way i can do it? I can see there is external drag and drop https://javascript.daypilot.org/demo/calend...
Daypilot Weekly Scheduler Event Box Size
Answered: You can control the behavior using useEventBoxes property: https://doc.daypilot.org/scheduler/exact-event-duration/ If you don't want the event boxes to be aligned with the grid use:
dp.useEventBox...
Invalid cellGroupBy value
Answered: I was able to fix it using the online configurator as a guide, here is the modified js used: dp.scale = "CellDuration"; dp.cellDuration = 15; dp.timeHeaders = [ {groupBy: "Day", format: "dddd d MMMM ...
Reorder resources?
Answered: The drag and drop row moving (https://doc.daypilot.org/scheduler/row-moving/) allows moving one row at a time. It will move the selected row, including all children. You can also change the resources...
Move Resoources
Answered: You can also move a resource by modifying the "resources" array. Afer making the changes, call update() to refresh the Scheduler. This example sorts the rows alphabetically (by name):
var dp = new ...
Question without answer for 11 months :/
Answered: Thanks for the update! It looks Ionic does some magic here and it swallows the event click until you click something else in the Scheduler. There is a workaround which is already available - just add...
Daypilot Modal (Mobile Safari Bug with Stretching)
There's an issue on mobile safari caused by it not returning the correct documentElement.clientHeight/Width. After testing some of the other ways to get the height of the modal I couldn't figure out ...
Can I make Joint Events move vertically across resources?
Answered: The behavior is controlled by multiMoveVerticalMode property. By default, it's set to "Disabled" which disables vertical moving. You can use "All" to enable vertical moving:
dp.multiMoveVerticalMod...
Getting error Uncaught TypeError: Cannot read property 'id' of undefined
Hi, I am using daypilot-calendar control and daypilot-month control, In my application i added Week and Month view, so based on selection i hide other and show that component, Its working fine, But r...
All appointments shifted by 30 minutes
Hi, Somehow, all my appointments (and business starting hours) are shifted by 30 minutes (see attachment). What am I doing wrong/how can I fix it? Using: DayPilot Calendar, Version: 2018.1.228-lite I...
[?] How to change the Event Areas value from dps.contextMenu
Answered: If you have access to the DayPilot.Event object (e) you can change it like this:
// e holds DayPilot.Event object
e.data.areas = [{ html: "Confirmed", right: jsonTags.AreasRight, bottom: jsonTags....
Setting eventheight dynamicly makes cells too large when expanding group overlapping
Answered: I was grabbing the value from a dropdown and did not run it through parseInt. That solved the problem - sorry for the trouble :-)
[?] Update Event client-site
Answered: After read some sample code, I know how to do. Instead of `e.client.moveEnabled = false; ` , it should be ` e.data.moveDisabled = false;` and after that, use ` dp.events.update(e).queue();` to update
Calendar stops working
Answered: Do you see any error in the JavaScript console? Does the whole page freeze (do other element on the page work) or is it just that the Calendar doesn't respond to mouse actions? I know that it might b...
options to split hour
Answered: For the Calendar component (used in index.php and doctor.php) you can adjust the scale to show 15-minute cells using cellDuration property:
var calendar= new DayPilot.Calendar("dp");
// ...
calen...
When collapse tree, it occurs unspecified error
Answered: This bug should be fixed now in the latest sandbox build (2018.2.3291): https://javascript.daypilot.org/sandbox/ Please let me know if the problem persists.
How to get all events by Resource
Answered: Ben, You can get a list of all events like this:
var events = dp.rows.find("A").events.all();
And delete them:
dp.rows.find("A").events.all().forEach(function(e) {
dp.events.remove(e);
})...
Reduce tree parent heights compared to children
Answered: The row height is derived from the event height (the total height is adjusted automatically to fit all events). You can specify custom event height for the parent rows using eventHeight property: htt...
Drag and select default (without holding shift key)
Answered: You can change the behavior using onGridMouseDown event handler: https://api.daypilot.org/daypilot-scheduler-ongridmousedown/ Example:
dp.onGridMouseDown = function(args) {
args.action = "Rectan...
Drag items off scheduler
Answered: At this moment, you can only drop the events on another Scheduler instance. There are two ways to approach this: 1. Use a context menu item (something like "Unschedule") to remove an event from the S...
Navigator Render error
Answered: hi thanks for your fix answer. JavaScript 2018.2.3281 and i use electron with Chromium 61.0.3163.100. thanks
Manual scale timeline with minutes
Answered: Henry, The time headers can use one of the group sizes defined here: https://doc.daypilot.org/scheduler/time-header-groups/ If you want to use a group size smaller than one hour you need to use group...
Daypilot Angular 2 : ERROR : DayPilot.Scheduler: The placeholder element not found: 'dp_1527237171484105172'.
Answered: The Scheduler requires that the component is actually rendered during initialization. It creates a placeholder with ID starting with "dp_" which needs to be present. It looks like the accordion doesn...
No themes other than defualt included with Angular package 2018.2.3281
Answered: The sample CSS themes (including scheduler_8) can be found in the zip package (both trial and full versions), in demo/themes directory. You can also download it directly using this link: https://java...
When create new event it shows wrong time
Answered: Dhiraj, How do you get the start/end dates of the selected range? The onTimeRangeSelect(ed) event handler returns DayPilot.Date object which uses the idealized time zone that the Calendar uses intern...
DayPilot Calendar Angular allowEventOverlap = false Not preventing Event Overlap
Answered: It looks like you are using an old version - the allowEventOverlap property is supported since 2018.1.3187 in the Calendar component: https://javascript.daypilot.org/daypilot-pro-for-javascript-2018-...
Changing the Daypilot instance
Answered: I found the solution myself, would be of help to others if ever come across this question. I simply used the dispose() method of the DayPilot, so when the event is triggered, I first got rid of the e...