Questions Tagged how-to
How to detect the end of a row move session?
Answered: In the latest sandbox build (2025.3.6658), the Scheduler supports a new property (rowMoveFireOnForbiddenTarget) that lets you configure this.
15 and 20 minute events don't show up correctly on workweek view
Answered: Thanks. This happens because the calendar uses event boxes by default. In the JavaScript version, you can turn it off using useEventBoxes: "Never". BTW, it looks like some of your property names are ...
Setting the "cssClass" property on a Calendar Event
Answered: Yes, this is correct. Please note that the CSS class is applied at the top level (it is added to the div with calendar_default_event class). You can verify that using browser developer tools. If you ...
Load from file
Answered: Loading files this way doesn’t work on a local filesystem. That’s a browser security limitation. You will need to run the app on a webserver.
How to change language of calendar in modal form?
Answered: You can specify the locale option for the modal form: const showDialog = async () => {
const form = [
{ name: "Name", id: "name" },
// ...
];
const data = {};
const option...
Calendar: Allow external drag and drop but disable the moving feature for events on the Calendar?
Answered: Yes, this is possible. Keep the value of eventMoveHandling set to "Update". Disable moving for all events by setting moveDisabled: true on each event. This can be done using onBeforeEventRender: onBe...
Header groups for Calendar component and viewType: 'Days'
Answered: Unfortunately, this feature is only supported in the Pro version.
How to access current column for onBeforeRowHeaderDomAdd?
Answered: Hi Andy, Yes, args.x is the column index. However, I recommend using onBeforeRowHeaderRender instead when possible (you can access the header cell properties using args.rows.columns[] there). The onB...
React scheduler PRO (trial) > Best practice for locking in visible dates
Answered: This is a good approach - take the width of the parent element and calculate the desired cellWidth before Scheduler initialization. The auto cell width feature uses the same approach. However, it has...
React schedule Pro (trial) > Disable/hide link one link dot for specific events
Answered: This can be added easily - I’ll let you know as soon as it is available.
React schedule Pro (trial) > Best practice for creating "bucket" cells in the timeline grid
Answered: Yes, this is an internal property and its name will change in the future. I would try to split the resources vertically using the split resources feature. It lets you define sub-resources for each re...
Not able to add html to the row header
Answered: You can set a custom HTML for the row header using onBeforeRowHeaderRender like this: onBeforeRowHeaderRender: args => {
args.row.html = `<div style="font-weight:bold; margin-bottom:5px;">${args.r...
Scheduler - sticky active area for touch devices
Answered: Sorry for the delay! At this moment, the active areas with position defined using the left property are included in the floating event element. Areas relative to the right are not included in the vie...
Crosshair when Drag&Drop (2025)
Answered: The crosshair is now enabled during drag and drop in the Calendar in the latest sandbox build (2025.3.6634). The behavior is now consistent with the Scheduler.
DatePicker popup - 2 questions
Answered: The DayPilot.DatePicker class is now included in the TypeScript definitions in the latest sandbox build (2025.3.6620). Thanks for reporting the problem. To set a custom first day of the week, use the...
Implement pagination in gantt chart in angular using daypilot
I need to implement pagination in gantt chart in angular using daypilot for that i need to add a load more button. by clicking on the button need to trigger. I’m stick in a situation like how to add ...
Box with Dynamic Timing in DayPilot Scheduler
Answered: It is possible to insert custom time segments (phases) into an existing events: Event Phases [docs] You can also take a look at the following related tutorial: JavaScript Scheduler: Warm-Up and Cool-...
Frozens Rows
Answered: Unfortunately, this scenario is not supported. It’s not possible to modify the list of dragged events on the fly. You shouldn’t call update() in onEventMoving - it will break things.
Prevent multiple range inside of itself
Answered: The Scheduler respects the value of allowEventOverlap - if you set it to false, the overlaps will be forbidden.
Is there any option for pagination daypilot gantt chart
Is there any option for pagination daypilot angular gantt chart
Scheduler - Changing area's properties: html and bubble dynamically
Answered: Unfortunately, this is not possible - the areas can’t be changed dynamically. However, if you call update(), it will repaint the whole Scheduler, including the upper-left corner and its areas. When y...
CSP violation issues
Answered: The latest release (2025.3.6564) now detects the nonce used by scripts and stylesheets on the page and uses it when registering the built-in stylesheet. You shouldn’t see this error anymore. If you u...
Max and Min dates irrespective of view port
Answered: This data isn’t calculated for internal purposes. You will need to go through the events in events.list and calculate it directly from the data.
Is it possible to supply a default value for the "searchable" daypilot modal form
I would like to set an initial/default value when opening a form for a field with the type "searchable", is it possible? Matching by key from data object does not work
Only show link when an event is hovered
Answered: Sorry for the delay! You should be able to add links dynamically using links.add() in onMouseOver and remove them using links.remove() in onMouseOut. If there is any problem, please let me know.
DatePicker
Answered: The Navigator is limited to selecting a day, week, month or a custom day range (within the visible dates). At this moment we don’t plan to implement year selection and or times.
Navigator update
Answered: Most likely, you are using a reference to an old instance that has been disposed already. So I recommend checking how you get the reference and make sure that it’s not an obsolete one.
Need to Sticky Calendar Header on Top
Answered: You can look at the height options, especially heightSpec: "Parent100Pct". This setting makes the Calendar component expand to fill its parent element. A vertical scrollbar is added automatically, so...
How to implement Dynamic Data Loading in angular gantt chart
In my application I have very large number of dataset or tasks to be loaded(eg- 100000+ data), so that loading these much data initially is not a good a idea so i plan for dynamically loading on scro...
Client-Side JPEG Export for custom headers and custom Event content
Answered: The capabilities of the image export are limited. Basically, you can export plain text and active areas. If you need an exact copy and are happy with the current viewport, it’s better to make a scree...
Questions 1-30 of 3078
Next