Active Questions
Change Hour Format
Answered: You can hide the minutes using CSS:
.calendar_default_rowheader_minutes {
display: none;
}
Calendar Customization
Answered: It is possible to modify the appearance using CSS. You can either override the built-in CSS theme for selected elements or you can create a custom CSS theme (https://themes.daypilot.org) and adjust i...
error with computed function (Calendar)
Answered: The $refs values will only be accessible after the component is mounted. Before that, this.$refs.calendar (or any other $refs value) will be undefined and you will see this error. 1. If you move your...
Use method on click (Calendar)
Answered: Yes - you should take a look at the onTimeRangeSelected event handler in your application. By default, the calendar doesn't do anything when you select a time range (click a cell) so if you see a mod...
Is there any way to export range SVG/PNG in Gantt View?
Answered: This should work fine - DayPilot.Gantt.exportAs() method uses the same syntax as DayPilot.Scheduler.exportAs(). However, the range defined using "dateFrom" and "dateTo" can only define a subset of th...
Create event only by clicking (Calendar)
Answered: If you click a calendar cell, it will fire onTimeRangeSelect (and onTimeRangeSelected) event handler where you can create a new event. This works in both versions (Lite and Pro). To make sure only a ...
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...
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/
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...
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/
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 ...
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...
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/
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...