Questions Tagged
Drag-drop from month calendar
Answered: At this moment, this is not supported but we will take a look at it.
How to display custom task array elements (React Calendar)
Answered: I have managed to solve this and the solution was: the method that build my events array was async and due to that fact, to update the events field in state I had to perform setState in .then functio...
ERROR TypeError: this.f is not a function at DayPilot.Navigator.select
Answered: This turned out to be a minification issue. It should be fixed now in the latest sandbox build (2023.1.449): https://release.daypilot.org/changes/jslite/ The next official release will be available n...
Parent resource id (Vue Scheduler)
Answered: The "dp" variable used in example is a reference to DayPilot.Scheduler object. In Vue, you can get it using the "ref" attribute:
<template>
<DayPilotScheduler id="dp" :config="config" ref="sched...
Prevent Event Move (Vue Scheduler)
Answered: You can implement custom rules for event moving using "onEventMoving" event handler. You can find an example here: https://doc.daypilot.org/scheduler/event-moving-customization/
How to manage dates in Gantt Chart View.
Answered: You can either use a string value (such as "2023-02-15" or "2023-02-15T00:00:00") which will be converted to an exact date.
const date = new DayPilot.Date("2023-02-15T00:00:00");
If you have a Da...
event display
Answered: By default, the Scheduler aligns event boxes with the grid cells. The exact start and end are displayed using the duration bar at the top of the event. You can turn it off using "useEventBoxes" prope...
Multiple title parent resource (Scheduler)
Answered: By default, the Scheduler component merges cells of parent resources into a single cell. You can enable multiple columns for parents using rowHeaderColumnsMergeParents property: https://api.daypilot....
Edit button submit form
Answered: If you mean the modal dialog (https://modal.daypilot.org), you can use the "okText" option to change the "OK" button text: https://api.daypilot.org/daypilot-modal-oktext/
How to clear the previous event from calendar if the updated event list is empty/null?
Answered: Great, thanks for the update. In the latest sandbox build (2023.1.444), the Calendar component now accepts null as well and treats it as []: https://release.daypilot.org/changes/jslite/
How not to trigger onEventClicked after canceling onEventDelete (Calendar)
Answered: This is a bug of the latest release. It should be fixed now in the latest sandbox build (2023.1.443): https://release.daypilot.org/changes/jslite/ The fix will be included in the next official releas...
Scheduler - How to set row header columns to a very compact width
Answered: By default, the Scheduler only extends the width automatically (to fit the text). If you want to show narrower columns, you can either enable shrinking (rowHeaderWidthAutoFitShrink) or set a smaller ...
Scheduler - How to align the text in the row header columns
Answered: You can use onBeforeRowHeaderRender event (https://api.daypilot.org/daypilot-scheduler-onbeforerowheaderrender/) to set the horizontal alignment:
onBeforeRowHeaderRender: args => {
args.row.colu...
Scheduler - Fix row header columns during horizontal scrolling
Answered: Unfortunately, this would be an enormous effort and the result would be very complex UI - so I don't see a way to add this at the moment.
How to export Gantt chart view in png/svg/pdf in 2022.4.5483 version.
Answered: The latest release now supports export customization events in the Gantt Chart component as well (https://javascript.daypilot.org/daypilot-pro-for-javascript-2023-1-5529/). You can use onBeforeRowHea...
Cannot read properties of null (reading 'dontFocus')
Answered: It looks like you are passing "null" as the "options" argument. Try removing it or use an empty object - "{}". This problem should be fixed now in the latest sandbox build (2023.1.5527).
How to customize title when using print()?
Answered: The print() method uses the title of the current page when printing. You can temporarily override the title like this:
const oldTitle = document.title;
document.title = "My Scheduler";
dp.exportA...
args.loaded is not a function
Answered: In version 2023.1.5508, asynchronous processing of onEventDelete is not supported. It is now available in the latest sandbox build (2023.1.5525+). See also: https://release.daypilot.org/changes/js/
Scheduler - Rendering issue with row header height after hiding/showing events
Answered: Thanks - but after changing the event properties, you need to update the Scheduler to make the changes visible. Do you call update()? Or events.update()?
Does Gantt have a dispose() method?
Answered: There is a special React package that defines a <DayPilotGantt> React component which you can use in your JSX instead of creating the instance manually using a placeholder and init() method. To see h...
How to set the start of the week as monday
Answered: The Gantt Chart component uses the "locale" property to determine the first day of week: https://api.daypilot.org/daypilot-gantt-locale/ You can use one of the built-in locales or create your own. Se...
Scheduler - Stacking of Overlapping Events
Answered: Do I understand it correctly that although there are three events in the screenshot you define six events? Events are rendered in the in the order determined by the default sort order. You can also d...
How to export Gantt view in png/svg/pdf
Answered: Please see my comments here: https://forums.daypilot.org/question/5962/how-to-export-gantt-chart-view-in-png-svg-pdf-in-2022-4-548
Scheduler - DayPilot.Scheduler: The placeholder element not found: 'dp_1673963716024126533'.
Answered: The Angular Scheduler component includes a placeholder div in its template. This placeholder is then initialized using init() call in ngAfterViewInit() - you can also see this in the stack trace. If ...
Gantt-Chart: Dotted line for current date
Answered: You can add a separator to the Gantt chart to highlight the current date/time: https://doc.daypilot.org/gantt/separators/ The separators are marked with "gantt_default_separator" CSS class - you can ...
Make editable cell in rowHeaderColumn when double click
Answered: The Scheduler supports inline editing of the row header. However, you can only edit the first row header column at the moment: https://doc.daypilot.org/scheduler/row-editing/
Splitter between the rowheader grid and task grid not showing
Answered: I've tried to add your config to a new Angular Gantt chart project generated using https://builder.daypilot.org and it seems to work fine. The splitter appears as expected. If you are using a custom ...
NPM javascript throws error "Uncaught ReferenceError: module is not defined"
Answered: The JavaScript NPM package (daypilot-pro-javascript) defines a CommonJS module which can't be used directly in the browser. The purpose is to allow using DayPilot in a Node project. In the browser, y...
Scheduler - How to add active areas to cells
Answered: 1. You can make space for the active areas at the bottom using the "rowMarginBottom" property : https://api.daypilot.org/daypilot-scheduler-rowmarginbottom/ 2. If you use the full crosshair mode the ...
Gantt - How to automatically move task2 start when task1 resized or moved
Answered: Unfortunately, there is no built-in support for automatic moving of the linked events at the moment. You would have to detect which tasks need to be moved and update them in onEventMoved event handle...