search envelope-o feed check
Home Unanswered Active Tags New Question

Questions Tagged how-to

gantt chart end date issue

when i add gantt chart in my UI, where the end date appears one day earlier in the DayPilot Gantt chart, Why? and how to solve this issue.

Kanban Card Bar Color

Answered: The onBeforeCardRender event is now available in the latest sandbox build (2025.2.6497). You can change the bar color depending on the column like this: onBeforeCardRender: args => { switch (arg...

DoubleClick instead of Click for editing

Answered: Yes, the Scheduler supports double click for events. It has to be enabled explicitly using the eventDoubleClickHandling property. It’s good to know that when the double click is enabled, it adds a de...

Html in the text property

Answered: The card content structure is fixed and it looks like this: <div class='kanban_default_card_header'>${name}</div> <div class='kanban_default_card_body'>${html}</div> If you don’t need the header, yo...

Update a Kanban card

Answered: Example: onCardClick: async args => { const form = [ {id: "name", name: "Name", type: "text"}, {id: "text", name: "Description", type: "textarea"} ]; const modal = aw...

Datepicker in corner : events vanish

Answered: I assume you are working with the JavaScript Scheduler: Date Picker in the Upper-Left Corner tutorial. 1. The SVG calendar icon is new and you need to use the latest version of daypilot.svg (you can ...

Kanban adding a delete button to ALL tasks that get rendered.

Answered: You can enable the built-in delete icon using the cardDeleteHandling property. The delete icon will be displayed in upper-right corner (when enabled).

Gantt chart group data end date issue

Answered: There are two group modes in the Gantt chart, and by default the component calculates the start and end from the group children. If you change the mode to "Manual", it will use the specified start an...

Milestone for scheduler

Answered: The Scheduler supports milestones are supported since version 2018.1.3203. It may be an issue of this particular release but I don’t see any serious bugs fixed in the release logs. You can follow the...

Scheduler column sorting

Answered: Unfortunately, the built-in column sorting feature is only available for the JavaScript version.

How to automatically moved to initial startdate and enddate of ganttchart

Answered: You can change the startDate and days properties as needed by calling the update() method: gantt.update({ startDate: "2025-05-01", days: 31 });

how to hide complete percentage from gantt chart

Answered: You can hide the progress bar using the completeBarVisible property.

how to dynamically add color to each tasks

Answered: You can use the onBeforeEventRender event to set custom event color in the Scheduler. The color can be set either directly using args.data.backColor or via a CSS class (by setting args.data.cssClass)...

Add group line in PhpMyadmin

Answered: You have added it correctly - but it will only display the expand/collapse icon when you add some child resources. If you want to hide the additional columns for these empty groups, you can remove th...

Add onClick functionality in onBeforeRowHeaderRender or onBeforeRowHeaderDomAdd

Answered: This seems to be a problem of some of the older releases. The latest version (2025.2.6442) should work fine with args.target = "Text";. Could you please give it a try? Please let me know if the probl...

Hide non business hours from scheduler

Answered: Yes, this can be done by hiding selected time columns using the onIncludeTimeCell event handler or by defining the timeline manually.

Events displayed only on 30 minute boundaries?

Answered: At this moment, the Lite version of the Calendar only displays events this way - the start and end times are aligned with the grid cells and the real duration is highlighted using the duration bar. H...

Issue with Hiding Non-Business Hours Spanning Two Days in DayPilot Scheduler

Answered: The onIncludeTimeCell logic should look like this (it works for two days and scale="Hours"): onIncludeTimeCell: (args) => { const businessStart = 21; // 9 PM (21:00) const businessEnd = 6; ...

Guest calendar

Answered: Please take a look at this tutorial: JavaScript Calendar in Read-Only Mode (Open-Source)

How to drag events to queue on iPad, currently it does not trigger events

How to drag events to queue on iPad, currently it does not trigger events

on gantt row expand

Answered: Since version 2025.1.5435, it is possible to handle these actions using these new events: onRowCollapse onRowExpand

change the Gantt link shape

Answered: Yes, you can use the same property (linkShape) in the Gantt Chart.

Is it possible to add custom html and css to the daypilot gantt?

Answered: You can use the onBeforeTaskRender event handler to customize the task boxes. This event will let you set custom color easily. { onBeforeTaskRender: (args) => { args.data.box.backColor = "#cc...

How to handle the progressBar per row in scheduler Angular

Answered: You can take a look at the JavaScript Scheduler: Resource Utilization Chart for Rows tutorial:

Hovering a draggable event and change row background-color

Answered: Sorry for the delay. This can be done like this: const scheduler = new DayPilot.Scheduler("scheduler", { onRowMouseOver: args => { if (app.dragging) { args.row.cells.all()....

Is it possible to edit gantt chart event

Answered: Yes, it is possible to activate inline editing mode for the row headers, or you can open a modal dialog with task details on click (see Task Editing).

is it possible to edit the event

Answered: Please see here: https://forums.daypilot.org/question/6575/is-it-possible-to-edit-gantt-chart-event

Error constructing DayPilot.Date()

Answered: Have you modified the source code? Or maybe you have overwritten the DayPilot.Date object? Because all this should work fine - you can also test it in the JavaScript console in the online demo.

How to access args.filter value in the onBeforeTimeHeaderRender event of DayPilot Scheduler

Answered: The filter param is only available in the onEventFilter event handler. The best way would be to store the filter value in a special variable outside of the Scheduler object. This approach is used for...

Filter hours

Answered: In the Lite version, you can use this config: { businessBeginsHour: 8, businessEndsHour: 21, heightSpec: "BusinessHoursNoScroll" } This will display only the specified hours, but there will...
Questions 1-30 of 3043 Next