Questions Tagged javascript

Answered: I’ve added it to the wishlist.

Answered: If you don’t specify the field type explicitly, the modal dialog form will use a date field when dateFormat is specified. If you want to use the full date/time value I recommend using the date/time f...

Answered: You can use a separator to display the current time indicator in the Angular Scheduler component: config: DayPilot.SchedulerConfig = { separators: [ { location: DayPilot.Date.now(), color: "red" } ],...

Answered: I recommend the following approach: For the database, use GMT value. Assign the desired time zone to each user. When sending the data from the server (when displaying data) or to the server (recordin...

Answered: This issue should be fixed now in the latest sandbox build (2024.1.5891): https://release.daypilot.org/changes/js/

Answered: > Any possibility to show the current timeline or highlight the current cell duration with different background in lite version? This is not supported in the Lite version at the moment. In the Pro ve...

Answered: The events are always rendered at locations specified by start/end. To show the event start at noon you need to specify the time as 12:00 ("2024-0307T12:00:00"). To align the event start/end during d...

Answered: > 1) On the new release, i can’t actually select a cell using left click. This was a nice nice-to-have since and now if i want to see a selected cell i have to click right. What can i do? There has b...

Answered: We don’t plan to add a vertical scrollbar support to the frozen rows in the Scheduler. If you want to display two independently scrolling row sections, I recommend using two Scheduler instances, like...

Answered: When resizing the inner section, you need to adjust the args.start and args.end values in the onEventResizing event handler. This is explained in the following tutorial: JavaScript Scheduler: Warm-Up...

Answered: The event can’t go forever (you need to specify start and end time) but it can be very long.

Answered: After changing the holiday definitions ( globalHolidays ), you need to call the update() method to refresh the Scheduler. This will generate a new time header (using onBeforeTimeHeaderRender ). Also,...

Answered: Unfortunately, the real-time event overlap protection is not supported in the Lite version at the moment. It is only available in the Pro version (see also the feature matrix ). However, you can chec...

Answered: If you want to disable Scheduler cells for drag and drop operations, it is necessary to mark them as disabled in the onBeforeCellRender event handler. The unavailable property of resources is not a s...

Answered: To display time cells with custom duration defined in minutes , you need to set the scale property to "CellDuration" : scale={"Manual"} cellDuration={30] Another option would be to use scale={"Manual...

Answered: oeps i see you can change it to type: "searchable", so that works :-)

Answered: Hi, Nothing related to that. [webpack-dev-server] Server started: Hot Module Replacement disabled, Live Reloading enabled, Progress disabled, Overlay enabled. core.mjs:26656 Angular is running in dev...

Answered: There is no easy way to do this. You can try detecting the cell dimensions using the internal dp.nav.main property which stores the DOM parent of grid cells.

Answered: The JSON serialization is necessary for Angular change detection. Circular references would also prevent any other change detection mechanism based on event comparison from working. To avoid this iss...

Answered: The time range selection always stays active, until you call clearSelection() or update the calendar. You might want to check your onTimeRangeSelect / onTimeRangeSelected handlers.

Answered: Unfortunately, custom React components in multiple row header columns are not supported at the moment. Until it is available, you can try using row header active areas to show the icons .

Answered: You can show the bubble using a time header active area : onBeforeTimeHeaderRender: args => { const header = args.header; args.header.areas = [ { left: 0, right: 0, top: 0, bottom: 0, action: "Bubble...

Answered: When you need to load a new task set in the Gantt chart, the best way is to replace the tasks with a new array: const tasks = [ /* ... */ ]; dp.update({tasks}); There is no need to clear the events f...

Answered: Drag and drop In the Lite (open-source) version, you can only enable/disable drag and drop for all calendar events using eventMoveHandling and eventResizeHandling . In the Pro version, you can disabl...

Answered: You might need to check the value of startOfMonth . Please make sure that it contains correct dates. My guess is that the values don’t correspond to the current view when the separators are not visib...

Answered: The Scheduler has built-in support for quick specification of business hours using businessBeginsHour and businessEndsHour but businessBeginsHour needs to be smaller than businessEndsHour . For more ...

Answered: There is no args.newResource available in onEventResize as the resource doesn’t change during resizing. You can access the event resource ID using args.e.resource() .

Answered: Please take a look at the following tutorial: JavaScript Scheduler: Swap Events using Context Menu

Answered: Thanks for the update! The problem is the type of events.resource_id database field. It is incorrectly set to varchar instead of integer . Older versions of PHP/PDO converted integer values to string...