Questions Tagged how-to
Reinitialize again Daypilot component or somehow destroy it on new reinit
Answered: There are two options: 1. You can reuse the "dp" instance (and use the update() method to apply the new configuration). 2. Destroy and unbind the old instance by calling dispose(): https://api.daypil...
How to call a daypilot EventClickJavaScript on button click of ASP.NET WEBFORM - C#
Answered: Instead of trying to build the DayPilot.Event object, I recommend changing the ask() function signature so it would accept individual parameters that are available to the button click event handler.
Keyboard navigation from last cell
Answered: With the latest version (https://javascript.daypilot.org/daypilot-pro-for-javascript-2021-3-5070/), you can update the keyboard focus in onEventClick event like this:
dp.onEventClick = args => {
...
Is it possible to get the same event of DayPilot on Gridview OnRawCommand ?
Answered: The 'e' variable holds a DayPilot.Event object. You can create it using the constructor: https://api.daypilot.org/daypilot-event-constructor/
How to call a DayPilotCalendar event on button click of ASP.NET ?
Answered: Try this:
<asp:LinkButton ID="linkbtn_show" runat="server" Text="Create New Task"
OnClientClick="javascript: create('2021-08-16T13:00:00', '2021-08-16T13:00:00', null);" >
</asp:LinkButton>
How to auto hide empty/unhide non-empty rows when scrolling horizontally and vertically
Answered: Applying the row filter requires an update of the Scheduler which is not possible during scrolling. However, the latest sandbox build (2021.3.5048) now includes a new rowEmptyHeight property which le...
Summary columns at the end of the Scheduler
Answered: Hi Petr, Unfortunately, it's only possible to display the summary on the left side (in the row headers) at this moment.
Daypilot does not detect window size is changed - content height is not adjusted
Answered: Are you able to reproduce the issue using the project from the "Angular Scheduler: Full Screen Layout" tutorial? https://code.daypilot.org/75104/angular-scheduler-full-screen-layout Please note that ...
Can't get resource.
Answered: Sorry for the confusion: In onEventMoved, you need to use args.newStart, args.newEnd, args.newResource instead. See also: https://api.daypilot.org/daypilot-scheduler-oneventmoved/
Target custom columnheader_cell as rowheadercol with number
Answered: The latest sandbox build (2021.3.5045) now support adding a custom CSS class to the column headers using onBeforeRowHeaderColumnRender event handler. https://javascript.daypilot.org/sandbox/ Example:...
Empy header cell for next columns if treeEnabled = true
Answered: The column content is set in onBeforeRowHeaderRender event handler. You'll need to modify it to exclude parent rows:
dp.onBeforeRowHeaderRender = (args) => {
// skip parent rows
if (arg...
Business hours begins and End where can I set them
Answered: What version of DayPilot Pro do you use? If it doesn't work with the latest version (2021.2.6054), could you please post your config? The following OnInit() seems to work fine with the latest version...
Scroll for X-Axis in top of Scheduler
Answered: The scrollbar position is defined by the browser and it can't be moved. So the answer is no. You might be able to implement your own scrolling logic using scrollTo() and scrollToResource() methods: h...
Drag n drop using cypress for e2e tests
Answered: Cypress isn't particularly good at detecting the layers correctly and this error message ("trigger failed because this element is covered by another element") is often misleading. Adding {force: true...
Get the current date?
Answered: If you want to get the date that was last clicked in the Navigator, you can read the selectionDay property: https://api.daypilot.org/daypilot-navigator-selectionday/
const nav = new DayPilot.Naviga...
Switch resource type for events
Answered: Yes, the best way would probably be to use two scheduler instances and switch between them. You might be able to do it with one instance but the configuration would be more complex. You can also take...
I did Buy the PRO Version but still show demo
Answered: 1. Please make sure that you have replaced the daypilot-all.min.js file with the full version. 2. You may need to force a reload using Ctrl+F5 in the browser. Or add a random string to the script pat...
Scheduler: Get RowHeaderColumns value
Answered: You can get the DayPilot.Row object using rows.find() method:
const row = dp.rows.find(args.resource);
Then you can access the original data object using row.data:
const country = row.data.coun...
how to add text in cells ?
Answered: You can write to cells using onBeforeCellRender event handler: https://api.daypilot.org/daypilot-scheduler-onbeforecellrender/ In order to make the text accessible even if there is an event scheduled...
How to set the width of an event indicator
Answered: You can increase the margin on the right side of a calendar column using "columnMarginRight" property: https://api.daypilot.org/daypilot-calendar-columnmarginright/ By default it uses 5 pixels.
Remove non Business Hours
Answered: This is possible - you need to add heightSpec: "BusinessHoursNoScroll" to the config: https://api.daypilot.org/daypilot-calendar-heightspec/ It's supported in the Lite version as well. In the Pro ver...
Remove seconds
Answered: Yes, you're right. There seems to be a problem with timeHeaderCellDuration values other than 60. It should be fixed now in the latest sandbox build (2021.2.5010): https://javascript.daypilot.org/sand...
Custom HTML code
Answered: In the Pro version, XSS protection is enabled by default and content specified using "text" property is automatically HTML encoded. You can use "html" property to specify raw HTML or you can disable ...
Can't hide sundays
Answered: You should take a look at the viewType property. It lets you hide weekends: https://doc.daypilot.org/calendar/work-week-view/ If you only want to hide Sundays, you can use viewType="Days", days=6 and...
Manage startHour and endHour for events in Month Calendar
Answered: In the Month component, the events are always displayed as all-day events (the width is aligned with cells). You can display the start and end time using eventStartTime and eventEndTime properties: h...
Show HTML on resources
Answered: In order to set raw HTML you can use the "html" property of the resources[] array items: https://api.daypilot.org/daypilot-scheduler-resources/ You can also customize the HTML dynamically using onBef...
How to update event text value after click on a button.
Answered: You need to get the DayPilot.Event instance first using events.find(). Then you can update the event using events.update().
const dp = this.scheduler.control;
const e = dp.events.find("1");
e.dat...
Background color for children resources
Answered: Nvm, I managed to find it. If anyone is looking for a solution, args.row.data.children[i].areas. Iterate over the row children
Active area not working for multiple column row headers
Answered: > I tried the simple tutorial that is available to get the active area working. How can I have it working on a specific column of my row header? If you define custom row header columns (rowHeaderColu...
Scheduler ContextMenu with async loaded data
Answered: Yes, it works as you describe. At this moment, the args.async option is not supported in the onShow() method but you can switch to manual event click/right click handling and open the context menu wh...