Questions Tagged javascript

Answered: Hi Dan, The simpler solution was to follow your idea: keepElement: true DayPilot makes no attempt to remove elements during any of it's callbacks then. I then manage the list of external draggable it...

Answered: It is important to keep the output JSON structure. The event data structure is described here: https://api.daypilot.org/daypilot-event-data/ You need to respect these property names - the database st...

Answered: In the Scheduler, you can use onBeforeCellRender to highlight selected cells. In that event handler, you can use args.cell.events() to get a list of events that overlap with the cell. See also: https...

Answered: This is probably a follow up on this question: https://forums.daypilot.org/question/5177/ignoring-left-click-behaviour-for-events You should be able to use onGridMouseDown, rectangleSelectHandling an...

Answered: Yes, it is possible using onBeforeCellRender: https://api.daypilot.org/daypilot-scheduler-onbeforecellrender/ This will change the status of the cell and the associated background color but it will n...

Answered: You can do this by creating a single version (with a transparent background) and adding the two active areas inside: onBeforeEventRender: function(args) { args.data.versions = [ { start: args.data.st...

Answered: It was intentionally not implemented in DayPilot.Date.parse() because of the ambiguity (and the docs was not correct - it was only supported in toString()). Anyway, it's now supported in the latest s...

Answered: It fires onRowHeaderColumnResized event: https://api.daypilot.org/daypilot-scheduler-onrowheadercolumnresized/

Answered: You can use a special frozen row at the top which will let you select a time range and expand it to the full column. Please see the following tutorial: https://code.daypilot.org/50252/javascript-sche...

Answered: The Scheduler lets you define column widths if you use a custom timeline: https://doc.daypilot.org/scheduler/timeline/ The Calendar and Month components don't allow specifying individual columns widt...

Answered: Unfortunately, drag and drop between components is not supported by the Calendar (only by the Scheduler).

Answered: You shouldn't add borders to the main time header div (.scheduler_default_timeheader_cell) because it changes its dimensions (it uses the default "box-sizing: content-box" style). The borders are def...

Answered: This should be fixed now in the latest sandbox build (2020.3.4657). Please let me know if the problem persists.

Answered: There is an event that lets you override the standard mouse behavior but it works on the grid layer only (below events): https://api.daypilot.org/daypilot-scheduler-ongridmousedown/ If these events a...

Answered: I recommend checking the date values. The Scheduler doesn't shorten events and the start and and date/time will correspond to the calculated timeline position. You can see that multi-day events are d...

Answered: Please see this grouping option: groupBy: "Cell" https://doc.daypilot.org/scheduler/time-header-groups/

Answered: You need to use more specific selectors, e.g. #dp .scheduler_default_matrix_vertical_line, #dp .scheduler_default_matrix_horizontal_line { background-color: #000000; } or add "!important" to the styl...

Answered: Vue 3 is now supported (since build 2020.4.4798).

Answered: array.forEach(function(id) { dp.events.remove(id); });

Answered: On touch devices, the active areas with visibility: "Hover" won't be displayed as there is no hover event. In some edge cases, the mobile browsers will fire mousemove event which is used to detect th...

Answered: You can do this in onShow event handler - it's called before the menu is displayed and you can use it to modify the context menu items. You can find an example here: https://api.daypilot.org/daypilot...

Answered: Unfortunately, this is not possible at the moment. You can modify the CSS and show the row header title at the top of the cell (the middle position may not work well for large heights).

Answered: You can get the row object (DayPilot.Row) using rows.find(): dp.onEventMove = function(args) { var row = dp.rows.find(args.newResource); // ... }; It's also possible to use onEventMoving instead to b...

Answered: The keyboard navigation tutorial is now available: https://code.daypilot.org/29708/javascript-scheduler-keyboard-navigation

Answered: This issue should be fixed now in the latest sandbox build (2020.3.4603): https://release.daypilot.org/changes/js/ Let me know if the problem persists.

Answered: This option is now available through snapToGridRectangleSelecting property in the latest sandbox build (2020.3.4604): https://release.daypilot.org/changes/js/

Answered: Hi Ruud, Thanks for reporting the issue - it's fixed now in the latest sandbox build and it will be included in the next release: https://release.daypilot.org/changes/js/