Questions Tagged javascript

Answered: Unfortunately, the makeDraggable() method can't be combined with the native HTML5 drag and drop API. However, there is now a new registerDropTarget() method available in the latest sandbox build (202...

Answered: You can use an active area with the following properties. This will ensure that the active area will be always visible: visibility: "Visible" Or you can make it permanently visible on touch devices. ...

Answered: You can do that by increasing the cellWidth value: scale: 'CellDuration', cellDuration: 10, cellWidth: 20, See also: https://doc.daypilot.org/scheduler/cell-width/

Answered: You can display Font Awesome icons using active areas. That will let you specify the icon position and dimensions. You can include the active areas in the data source (events.list) but it's better to...

Answered: By default, the Scheduler displays event boxes rounded to the grid cell borders. The exact duration is displayed using the duration bar (if enabled). You can change this behavior using useEventBoxes ...

Answered: You need to make sure that the URL used in dp.rows.load() call returns the data correctly. I recommend using browser developer tools (Ctrl-Shift-I or Option-Command-I), the Network tab, to inspect th...

Answered: No, the Lite version only supports 30-minute slots. See also: https://doc.daypilot.org/calendar/time-cell-duration/

Answered: Please see my answer here: https://forums.daypilot.org/question/5494/how-to-refresh-gannt-chart-based-on-dropdown-values

Answered: The following tutorial includes a project that displays a drop-down list with locations: https://code.daypilot.org/61166/php-shift-planning-javascript-html5-mysql-database When a user selects an item...

Answered: The backend_events.php script should look like this: <?php require_once '_db.php'; $stmt = $db->prepare("SELECT * FROM leave_event WHERE NOT ((leave_end <= :start) OR (leave_start >= :end))"); $stmt-...

Answered: You can change the text color using onBeforeTaskRender event: dp.onBeforeTaskRender = function(args) { if (args.type === "Group") { args.data.box.fontColor = "#ffffff"; } }; See also: https://api.day...

Answered: The warnings on non-passive event listener only appear if you set the log level to "Verbose". It's a hint and not something that can be "fixed" in all cases. The non-passive listener is essential for...

Answered: Please see the following tutorial: https://code.daypilot.org/30113/react-scheduler-how-to-enable-undo-redo

Answered: This should be fixed now in the latest sandbox build (2021.3.5062): https://release.daypilot.org/changes/js/ It looks like Safari started to report a different scrollbar width when a mouse is connect...

Answered: Solved! Dunno why, but it seems that removing the ID attribute deputies to the AJAX conversion the content is correctly sent to db. If someone could explain me why this trick worked should be great. ...

Answered: Unfortunately, this is not possible at the moment. You can implement this feature using your own button. You can find an example here: https://javascript.daypilot.org/demo/scheduler/rowheadercolumns....

Answered: The Scheduler checks if the object in the "resources" property is an array. If it isn't, it throws this exception. You should make sure that you are passing a correct object. I recommend printing the...

Answered: There are two options: 1. You can reuse the "dp" instance (and use the update() method to apply the new configuration). 2. Destroy and unbind the old instance by calling dispose(): https://api.daypil...

Answered: With the latest version ( https://javascript.daypilot.org/daypilot-pro-for-javascript-2021-3-5070/ ), you can update the keyboard focus in onEventClick event like this: dp.onEventClick = args => { //...

Answered: The keyboard API is now available - please take a look at the following tutorial: https://code.daypilot.org/68177/javascript-scheduler-how-to-use-the-keyboard-api

Answered: Unfortunately, the package size can't be reduced. We recommend the following to improve the loading time: make sure the bundle is served compressed (in your screenshot, you can see that the gzipped s...

Answered: Applying the row filter requires an update of the Scheduler which is not possible during scrolling. However, the latest sandbox build (2021.3.5048) now includes a new rowEmptyHeight property which le...

Answered: Hi Petr, Unfortunately, it's only possible to display the summary on the left side (in the row headers) at this moment.

Answered: Are you able to reproduce the issue using the project from the "Angular Scheduler: Full Screen Layout" tutorial? https://code.daypilot.org/75104/angular-scheduler-full-screen-layout Please note that ...

Answered: The image export only supports a limited set of CSS styles. The Scheduler tries to detect the background color but if you use an unsupported background style it will fail. You can override the auto-d...

Answered: Sorry for the confusion: In onEventMoved, you need to use args.newStart, args.newEnd, args.newResource instead. See also: https://api.daypilot.org/daypilot-scheduler-oneventmoved/

Answered: This looks like an old copy of the demo. You can find the latest version here: https://javascript.daypilot.org/demo/scheduler/eventmenu.html It should work fine for both the time range selection (use...

Answered: The latest sandbox build (2021.3.5045) now support adding a custom CSS class to the column headers using onBeforeRowHeaderColumnRender event handler. https://javascript.daypilot.org/sandbox/ Example:...

Answered: The column content is set in onBeforeRowHeaderRender event handler. You'll need to modify it to exclude parent rows: dp.onBeforeRowHeaderRender = (args) => { // skip parent rows if (args.row.children...

Answered: You can find a demo of the monthly calendar (Lite version) here: https://javascript.daypilot.org/demo/lite/month/index.html Click the "Show source" button to see the JavaScript source code. This demo...