Questions Tagged how-to

Answered: There are two options: 1. You can print the exported image (SVG format works best because it's scalable). This command exports the Scheduler as SVG and open the browser print image: this.scheduler.co...

Answered: If you are switching the date using an .update() call you can simply update the resources array ( https://api.daypilot.org/daypilot-scheduler-resources/ ) at the same time. It might be also possible ...

Answered: Unfortunately, the Lite edition doesn't support event selecting. In the Pro version, you can select the events using SelectedEvents list (in the Scheduler). It's a list of simplified EventInfo object...

Answered: There are two ways to fix that: 1. Apply additional padding to the inner event div ("scheduler_default_event_inner" CSS class in the Scheduler) to prevent overlapping with the active area. 2. Set the...

Answered: One option is to add custom CSS (using cell.cssClass) and create styles for all different combinations of classes (they are all applied at the same level): .scheduler_default_cell, .scheduler_default...

Answered: You can customize the task text/HTML using onBeforeTaskRender: config: any = { onBeforeTaskRender: args => { args.data.box.html = args.data.text; // displays task text instead of percentage in the bo...

Answered: You can handle onEventRightClick event and use it to open your own context menu: dp.onEventRightClick = function(args) { args.preventDefault(); var e = args.e; // DayPilot.Event object // open the co...

Answered: Hi Aliaa, Take a look at the following tutorial: https://code.daypilot.org/20663/html5-machine-production-job-scheduling-tutorial-php-mysql In "Creating a Follow-Up Job" section, it explains how to c...

Answered: Just use two placeholder divs and create a DayPilot.Gantt instance for each of them: <div id="gantt1"></div> <div id="gantt2"></div> <script> var gantt1 = new DayPilot.Gantt("gantt1"); // config .......

Answered: This exception is part of the input data validation that was introduced recently. You should check if the events.list property holds correct items. It must be an array of objects which have the follo...

Answered: Sorry, it's ok. I didn't use the constructor to create my dp2.locale variable .! > dp2.locale = new DayPilot.Locale(jsonObj.data.settings[0].cultureInfo); Still thanks for the time you spent reading ...

Answered: The JavaScript config object would look like this: { eventClickHandling: "Select", onEventSelect: function(args) { OnEventClick(args.e); }, eventDoubleClickHandling: "Enabled" // it's disabled by def...

Answered: Resolved

Answered: In the MVC version, the time headers are generated on the server side and it's not possible to switch the view without calling the server. You can request an update using commandCallBack() method whi...

Answered: You can change the event background color using onEventClick event handler: dp.onEventClick = function(args) { var e = args.e; e.data.backColor = "blue"; dp.events.update(e); }; There is also a built...

Answered: I was able to figure this out by setting the setting TimeRangeSelectedHandling to disabled.

Answered: I'm not sure if this is what you need but you can control how concurrent events are arranged using EventArrangement property: https://doc.daypilot.org/calendar/event-arrangement-mode/ Let me know if ...

Answered: You can control the behavior using useEventBoxes property: https://doc.daypilot.org/scheduler/exact-event-duration/ If you don't want the event boxes to be aligned with the grid use: dp.useEventBoxes...

Answered: You can control the visible data range using StartDate and Days properties. You can use Days property to increase the number of visible days.

Answered: You can also move a resource by modifying the "resources" array. Afer making the changes, call update() to refresh the Scheduler. This example sorts the rows alphabetically (by name): var dp = new Da...

Answered: You can also change the background color of the grid cells, the mechanism is the same. Just use BeforeCellRender event handler: protected void DayPilotScheduler1_BeforeCellRender(object sender, DayPi...

Answered: Arghhh... In the Page markup at the top of the edit and new aspx markup... AutoEventWireup="true" needs to be set (as it is in the demo). Creating a new webform in visual studio by default sets that ...

Answered: The behavior is controlled by multiMoveVerticalMode property. By default, it's set to "Disabled" which disables vertical moving. You can use "All" to enable vertical moving: dp.multiMoveVerticalMode ...

Answered: You'll need a library that handles iCalendar format to import an ics file. One of the free libraries available is DDay.iCal. It's used in the export tutorial for exporting the events to ics: https://...

Answered: Unfortunately, this feature is only available in the Pro version. See also the feature comparison: https://aspnet.daypilot.org/feature-matrix/

Answered: If you have access to the DayPilot.Event object (e) you can change it like this: // e holds DayPilot.Event object e.data.areas = [{ html: "Confirmed", right: jsonTags.AreasRight, bottom: jsonTags.Are...

Answered: After read some sample code, I know how to do. Instead of `e.client.moveEnabled = false; ` , it should be ` e.data.moveDisabled = false;` and after that, use ` dp.events.update(e).queue();` to update