Answered: The modal dialog form is designed to display one field per row. You might be able to adjust the CSS to display two fields per row but it is not supported out of the box at the moment.
Answered: Yes, you can add a custom progress bar using active areas. This approach is outlined in this tutorial (it's for React and Scheduler but the same logic can be used in the Gantt chart component): https...
Answered: In the Scheduler, events will only be displayed if the "resource" property value of an event matches the row id as specified in "resources" array, "id" property. The values need to match exactly, i.e...
Answered: You can display recurrent events (and add the necessary icons) but you need to handle the recurrence definition and storage on the server side. The calendar needs to receive the individual occurrence...
Answered: You can find the documentation here: Resizing: https://doc.daypilot.org/gantt/task-resizing/ https://api.daypilot.org/daypilot-gantt-ontaskresize/ Moving (horizontal): https://doc.daypilot.org/gantt/...
Answered: This looks like the minute part which is included in the standard view. However, it doesn't display if you use timeHeaderCellDuration value other than 60. I recommend checking the onBeforeTimeHeaderR...
Answered: This seems to be caused by the wrapper divs that you use to display the columns for DayPilotNavigator and DayPilotCalendar. The tutorial uses "display: flex" to arrange these components but your code...
Answered: You can use the "dateFormat" property of the date field: const resources = [ {name: "Resource A", id: "A"}, {name: "Resource B", id: "B"}, {name: "Resource C", id: "C"}, ]; const form = [ {name: "Tex...
Answered: You can hide non-business hours using the heightSpec property: const calendar = new DayPilot.Calendar("dp", { heightSpec: "BusinessHoursNoScroll", //... }); calendar.init(); See also: https://doc.day...
Answered: You can disable time range selecting using the config: { timeRangeSelectedHandling: "Disabled", // ... } If you want to use this feature to create new events, it is necessary to call clearSelection()...
Answered: You can load resources from an API like this: async componentDidMount() { const {data} = await DayPilot.Http.get(`/api/resources`); this.setState({resources: data}); } The returned data must follow t...
Answered: There is now a new zoom API available in the latest sandbox build (2023.1.5540). See also: https://release.daypilot.org/changes/js/ The API docs and a tutorial are coming soon.
Answered: Probably the easiest solution would be to add a simple <img> element that you hide using CSS so it isn't visible by default. Then you can make it visible using a client-side click event handler (OnCl...
Answered: The value of "this.$refs.calendar" will be null before the component is mounted. That means the computed "calendar()" method will return null as well. If you call "loadEvents()" too early it will thr...
Answered: Frozen rows are now supported by the row filter in the latest sandbox build (2023.1.5544). The documentation is updated as well: https://doc.daypilot.org/scheduler/frozen-rows/
Answered: Sorry for the confusion. You can do this by changing the order of tasks in the data source (it's stored in dp.tasks.list). Then call update() to apply the changes.
Answered: This example uses onBeforeCellRender to customize the monthly calendar cells. It adds the action button using an active area. In Angular, it could look like this: onBeforeCellRender: (args) => { cons...
Answered: This issue should be fixed now in the latest sandbox build (2023.1.5540): https://release.daypilot.org/changes/js/ Please let me know if the problem persists.
Answered: The Scheduler provides the following tools to help you make it accessible: the Scheduler elements (main areas, items) are marked with "aria-label" attributes you can enable keyboard support ( https:/...