Answered: This example will calculate a sum of values stored in a specified event field ("val"): onBeforeCellRender: (args) => { if (args.cell.isParent) { const field = "val"; const children = dp.rows.find(arg...
Answered: The cells in rows marked with "cellsAutoUpdated: true" will be updated on every change, including a row removal. You might want to review and update the calculation logic. The tutorial ( https://code...
Answered: You'll need to transform your data set to match the data structure required by the Scheduler. It displays the name specified by the "name" property: https://api.daypilot.org/daypilot-scheduler-resour...
Answered: This bug should be fixed now in the latest sandbox build (2022.1.5232): https://release.daypilot.org/changes/js/ Please let me know if there is any problem.
Answered: 1. Yes, the active areas are rendered on top of the event and it covers the text. The solution here would be to render the text in a special active area that is rendered last (they are rendered in th...
Answered: The event content div (*_event_inner) uses "display: flex" which prevents "text-align: center" from working. You will need to use "justify-content: center;" instead. It has to be set on the inner div...
Answered: It looks like you are using the open-source Lite version which includes only a subset of features. The scrollToHour() and message() methods are only available in the Pro version at the moment. See al...
Answered: This is a divider between row headers and the main Scheduler grid. At this moment, it is always resizable when you enable row header scrolling: https://api.daypilot.org/daypilot-scheduler-rowheadersc...
Answered: You can set custom row height using minHeight property ( https://api.daypilot.org/daypilot-scheduler-resources/ ). However, it doesn't calculate the value automatically. In order to avoid the white s...
Answered: The width auto-fit feature works with row header columns as well, but the width is calculated for the content cells (not for the column titles).
Answered: The built-in zoom system (see the tutorial at https://code.daypilot.org/32893/javascript-scheduler-zoom ) lets you specify the values either statically or using a function. If you use a function you ...
Answered: To learn how to use the Scheduler component with Node.js please see the following tutorial: https://code.daypilot.org/95340/react-activity-planning-system-node-express-postgresql Also, please note th...
Answered: To learn how to use the React Scheduler component please see the following tutorial: https://code.daypilot.org/77607/react-scheduler-tutorial The React version of the hotel tutorial is not available ...
Answered: The HTML5 Scheduler tutorial ( https://code.daypilot.org/87166/html5-scheduler ) uses a flatten() function which does essentially the same that you are doing: function flatten(resources, result) { re...
Answered: There is a tutorial available that shows how to display holidays (by setting a custom scheduler cell background color): https://code.daypilot.org/93068/javascript-scheduler-displaying-holidays I beli...
Answered: OK, thanks for the update. In the Scheduler, there are two ways to achieve that: 1. You can define the timeline manually by adding individual cells: https://doc.daypilot.org/scheduler/timeline/ 2. Yo...
Answered: You can make the text smaller using CSS but this will not ensure that every possible text will be displayed in full. I recommend using the bubble component which can display additional details using ...
Answered: You can use onBeforeRowHeaderRender event handler to add a custom CSS class: https://doc.daypilot.org/scheduler/row-header-customization/ Example: JavaScript dp.onBeforeRowHeaderRender = function(arg...
Answered: At this moment, blocking selected dates is only supported in the Pro version. Please see the following tutorial: https://code.daypilot.org/88013/javascript-calendar-blocking-selected-dates
Answered: These issues should be fixed now in the latest sandbox build (2022.1.5209): https://javascript.daypilot.org/sandbox/ Please let me know if there is any problem. And thanks for reporting the issues!
Answered: Yes, the "daypilot-pro-react" package is paid. If you are looking for the free package, take a look at "@daypilot/daypilot-lite-react": https://www.npmjs.com/package/@daypilot/daypilot-lite-react The...
Answered: The purpose of the invalidate() method ( https://api.daypilot.org/daypilot-cellarray-invalidate/ ) is to ask for a fresh result of onBeforeCellRender event callback. It is useful if you display calcu...
Answered: This issue has been fixed in version 2020.3.4547: https://javascript.daypilot.org/daypilot-pro-for-javascript-2020-3-4547/ I recommend switching to the latest version though - which is now 2022.1.518...
Answered: The cell borders are rendered using long 1px elements that are displayed at the cell boundaries. The color is set using "background-color" style. The horizontal lines are marked with .scheduler_defau...
Answered: Unfortunately, this is not possible. You might be able to mimic this arrangement in the Scheduler using a combination of custom start/end values and eventStackingLineHeight ( https://doc.daypilot.org...
Answered: You can change the bar width using CSS: <style> .wider-bar .calendar_default_event_bar, .wider-bar .calendar_default_event_bar_inner { width: 12px; } </style> And add the "wider-bar" CSS class to the...
DayPilot