Questions tagged how-to

Answered: The behavior can be reproduced by reducing the available width. I would start by checking the container styles and fixed minimum widths.

Answered: Hi Ed, I did a couple of tests to check the issues. 1. The RowClick event seems to work fine like this: RowClickHandling="Callback" OnRowClick="DayPilotScheduler1_OnRowClick" Code behind (C#): protec...

Answered: At this moment, the Calendar component doesn’t expose the coordinates of the time range selection. It’s an element with .calendar_default_shadow CSS class attached so you can use that to locate it an...

Answered: I have added your feature request to the wishlist.

Answered: This feature is available in the Pro version: Fixed Column Width In the Lite version, you can use the Scheduler component with switched axes (resources on the Y axis).

Answered: Unfortunately, this feature is only available in the Pro version: Calendar: Column Header Hierarchy

Answered: You can use the onBeforeCellRender event handler to add a custom CSS class to selected cells. At this moment, the Lite version doesn’t support the onBeforeHeaderRender event. However, you can use a c...

Answered: By default, the Calendar aligns event boxes with the grid. You can adjust this behavior and display the exact event duration using the useEventBoxes property.

Answered: Hi Leo, It was just that the Scheduler was ahead. In the latest release ( 2026.2.6936 ), the Calendar supports the same behavior: it lets you select a time range using right mouse click. In this case...

Answered: Hi Iliah, You can use the onEventMoving event handler to provide real-time feedback during drag and drop (see also event moving customization ).

Answered: With autoScroll enabled, you should be able to scroll automatically to the target task while creating a link by dragging.

Answered: Yes, this is possible using the events.find() method. You can also access the events.list array directly. In ASP.NET WebForms, you need the client-side object to access the API. <DayPilot:DayPilotMon...

Answered: 1. This should work fine. On PostBack, the TimeRangeSelected event is called for every cell and the values are updated on the client side. You can test it in the Calendar/Navigator.aspx demo page: If...

Answered: Sorry for the delay. I would make a few changes: Instead of using a special time header row, use a frozen row. Mark this row with cellsAutoUpdated: true , that will re-render the content on every cha...

Answered: This is a global property that should be set in the Scheduler config (see linkShape in the API docs), rather than in individual link properties.

Answered: The JavaScript version doesn’t have built-in support for recurring events. You need to implement this feature on the server side and pass the full list of occurrences to the component on the client s...

Answered: This issue should be fixed now in the latest sandbox build (2025.4.6750). If the problem persists, please let me know.

Answered: As far as I can see, the event border seems to work fine on all-day events: onBeforeEventRender: args => { args.data.borderColor = "red"; } If it doesn’t show properly in your app, I recommend inspec...

Answered: This works on touch devices because it’s supported natively there. On other devices, you can use a touchpad or a mouse wheel to scroll in both directions. Emulating this with mouse down + drag is not...

Answered: This is what Floating Time Headers feature does. It should be enabled by default, so it looks like you might have turned it off.

Answered: The value of args.header.end is correct: "2025-11-10T00:00:00" is the exact time point marking the end of the group. However, you can’t simply use the date-only part of this date/time value when gene...

Answered: This is a special spacing div that is required for proper vertical synchronization of the grid and the row headers. It is marked with scheduler_default_rowheader which makes it look like row header. ...

Answered: The onEventMoving event is not available in the Lite version. However, you can apply your rules in the onEventMove event (on drop) and cancel the action using args.preventDefault() if needed.

Answered: The floating events feature is only available for the left side of the viewport.

Answered: It looks like this CSS works for me, so the problem might be somewhere else. You can try turning off your custom JSX temporarily to see if that causes the issue. .scheduler_default_rowheader:hover { ...