Questions Tagged how-to

Answered: You need to use more specific selectors, e.g. #dp .scheduler_default_matrix_vertical_line, #dp .scheduler_default_matrix_horizontal_line { background-color: #000000; } or add "!important" to the styl...

Answered: array.forEach(function(id) { dp.events.remove(id); });

Answered: You can do this in onShow event handler - it's called before the menu is displayed and you can use it to modify the context menu items. You can find an example here: https://api.daypilot.org/daypilot...

Answered: Unfortunately, this is not possible at the moment. You can modify the CSS and show the row header title at the top of the cell (the middle position may not work well for large heights).

Answered: You can get the row object (DayPilot.Row) using rows.find(): dp.onEventMove = function(args) { var row = dp.rows.find(args.newResource); // ... }; It's also possible to use onEventMoving instead to b...

Answered: The keyboard navigation tutorial is now available: https://code.daypilot.org/29708/javascript-scheduler-keyboard-navigation

Answered: It looks like the onAfterRender event handler wasn't fired properly if args.clearEvents was set to true in onScroll (and that is the default value). It should be fixed now in the latest sandbox build...

Answered: There is a static DayPilot.Bubble.hide() method that will hide the current bubble immediately: https://api.daypilot.org/daypilot-bubble-hide/

Answered: Please take a look at the following tutorial: https://code.daypilot.org/68382/javascript-calendar-selecting-and-highlighting-columns

Answered: And what's the use case? The purpose of onGridMouseDown is to modify the click + shift/ctrl/meta behavior before the actual events are fired, not to handle clicks on events and cells. Normally you wo...

Answered: Sometimes, the intranet site is configured (by group policy or in IE settings) to use IE compatibility mode which is not supported by DayPilot. This is the most common problem of different behavior w...

Answered: The infinite scrolling is only supported for timelines generated automatically (scale !== "Manual"). However, it's possible to adjust the generated time cells using onIncludeTimeCell to achieve the s...

Answered: Unfortunately, I'm not able to reproduce the problem with args.clearEvents = true. Which version of DayPilot do you use? In Angular, it's necessary to avoid changes to the watched objects ([config] a...

Answered: You can set the background color for the whole row header using e.BackgroundColor in BeforeResHeaderRender: protected void DayPilotScheduler1_BeforeResHeaderRender(object sender, DayPilot.Web.Ui.Even...

Answered: It seems i was to early with my post. i came across this documentation. https://doc.daypilot.org/scheduler/infinite-scrolling/ Going to try this out first.

Answered: You can set the z-index of both components using zIndex property: https://api.daypilot.org/daypilot-modal-zindex/ https://api.daypilot.org/daypilot-menu-zindex/

Answered: You can access the original data object like this: var data = events[0].data;

Answered: Please see the following tutorial: https://code.daypilot.org/60333/using-daypilot-modal-in-angular-application-typescript

Answered: The onBeforeCellRender implementation must be very fast because it's called for every cell in the grid during scrolling. I recommend reading all cell data in advance and storing it on the client side...

Answered: In the Pro version, this can be set using dayBeginsHour and dayEndsHour properties. See also: https://doc.daypilot.org/calendar/overnight-scheduling/

Answered: The right property name is "barColor". Here is a full list of event object properties: https://api.daypilot.org/daypilot-event-data/ There is also an example that shows how to change the duration bar...

Answered: In the JavaScript version, all member names follow the camel case convention. You need to use "heightSpec": https://api.daypilot.org/daypilot-calendar-heightspec/

Answered: It's the Vue app: var app = new Vue({ el: '#scheduler-app', data: { } }); It was missing in the previous code samples - the tutorial is updated now.

Answered: Yes, you'd have to calculate the cellWidth based on the viewport size. Something like this: cellWidth: function(args) { var days = args.date.daysInMonth(); return Math.floor(dp.nav.scroll.clientWidth...

Answered: Yes, you can use BeforeCellRender to set the content of every grid cell. See also: https://doc.daypilot.org/scheduler/cell-customization/

Answered: I'm not sure if this is what you are looking for but if you have existing unscheduled events/tasks that need to be scheduled you can use external drag and drop to move them to a specific time slot in...

Answered: You can set the content of the grid cells using BeforeCellRender (see also https://forums.daypilot.org/question/5098/can-we-assign-value-to-parent-control-in-daypilotscheduler1 ). You can also add sp...

Answered: This is possible but you'll need to calculate the values yourself because there is no API to get a list of events for the specified time range in the ASP.NET WebForms version.