All Questions
Scheduler Event Phases
Answered: The event phases are displayed using active areas (https://doc.daypilot.org/scheduler/event-active-areas/). Active areas are rectangles inserted into events. The can be positioned using css-like left...
How to prevent the changed between dates when we implemented Rowfilter and Scrolling.
Answered: When infinite scrolling is enabled, it is necessary to be careful when changing the Scheduler timeline parameters (scale, cellWidth, startDate and especially days). The infinite scrolling feature shi...
How to populate second RowHeader from database
Answered: You can set the column data source using "display" property of the rowHeaderColumns[] array items: This requires DayPilot Pro for JavaScript version 2019.4.4073 or later (with the tabular mode suppor...
height of scroll field
Answered: If you are using heightSpec="Parent100Pct" you'll need to call the show() method to fix the height based on the new parent element height: https://api.daypilot.org/daypilot-scheduler-show/
Overwriting an event backColor seems to remove capability to change selected color
Answered: You can do this by adding the following CSS:
.scheduler_default_selected {
background-color: black;
}
.scheduler_default_selected .scheduler_default_event_inner {
opacity: 0.7;
}
It als...
ERROR Error: DayPilot.Scheduler: The placeholder element not found: 'dp_158159830263098078'.
Answered: You can use *ngIf on the <daypilot-scheduler> element:
<daypilot-scheduler [config]="config" [events]="events" #scheduler *ngIf="visible"></daypilot-scheduler>
You can also create the component d...
DayPilot.GanttConfig doesn't include onRowCreate
The type definitions of Daypilot.GanttConfig (daypilot-pro-angular 2020.1.4216.) Don't include the function type OnRowCreate Nor is it included in the api docs https://api.daypilot.org/daypilot-gantt...
why e.CssClass doesn't load the css?
Answered: The CssClass property specifies the CSS class that will be applied to the DOM element (in this case an event) in addition to the built-in CSS classes. It's not the name of the stylesheet file. You ca...
Changing message duration depending on the message "type"
Answered: Yes, this is possible. You can specify the delay using the "options" parameter of the message() method:
dp.message("Welcome!", {delay: 5000});
See also: https://api.daypilot.org/daypilot-schedule...
Problems between Infinite Scrolling and Switcher over Scheduler Calendar
Answered: The Switcher is only necessary if you want to manage different components, e.g. DayPilot.Calendar for the week view and DayPilot.Month for the Month view. If you are using two different configuration...
Input string is not in the correct format error on Samsung Galaxy Note device
We have a web application that uses DayPilot to display a 1, 3 or 7 day view with the hours along the side. In this view there will be calls that the user can click on to take them to another page. T...
Idea needed - what control to use to display lots of events?
Answered: The monthly calendar includes a special "cell stacking mode" that lets you set a fixed day cell height and stack all events inside. A vertical scrollbar will be added if necessary: https://doc.daypil...
Is a "clear" required when calling again makeDraggable of items?
Answered: The makeDraggable() method adds special event handlers (mousedown, touchstart) to the target DOM element but it doesn't link it to the Scheduler component. It's not necessary to clean the elements ex...
Can I drag and drop from DayPilotMonth to Navigator?
Answered: Unfortunately, dragging events to the Navigator component is not supported.
how can i get the calendar to show an specific date?
Answered: i solved this in an easier way than i expected. I just discovered i can use thymeleaf in the javascript so i send the model of an event to the view and i get it done like this. <script th:inline="jav...
Disable Link Creation per event
Is there a way to disable link creation per event? I would like something like the way move, resize, etc... can be disabled now on js side. ie: event.data.moveDisabled = true. The best would be if ev...
Row Sort Event/Property for scheduler
Answered: Since build 2020.1.4264, it's possible to read the current sort criteria using DayPilot.Scheduler.rows.sortParam property (read-only): https://api.daypilot.org/daypilot-scheduler-rows-sortparam/
Scheduler Scrollbar position
Answered: The scrollbar used by the Scheduler is the native browser scrollbar which is always displayed at the bottom. In order to make the scrollbar visible, make sure that you are using heightSpec="Parent100...
adding columns
Answered: If you mean the row header columns you can change them using "rowHeaderColumns" property. In React, you can use rowHeaderColumns attribute of the <DayPilotScheduler> tag. See also: https://doc.daypil...
Export to PDF Week row problem
Answered: I have found the solution. It is to set DayPilotScheduler.CellWidthSpec = Enums.Scheduler.CellWidthSpec.Fixed Then all levels in timeheader is showed correct.
Multiple Events in single Cell in one Line for Scheduler
Answered: Please take a look at this option: https://doc.daypilot.org/scheduler/exact-event-duration/ Let me know if this is not what you are looking for.
Multirange selecting in react disapears when you set the state of the component
In react when you change a component state it will refresh the render. Normally you pass the state to the childcomponents but I can't find the correct method to do so for multi time range selecting. ...
Scheduler drag and scroll
Answered: On the desktop, this is not supported. You need to use the scrollbar or custom scrolling controls (implemented using scrollTo() - https://api.daypilot.org/daypilot-scheduler-scrollto/). On touch devi...
Vertical scroll
Answered: Yes, please see the options here: https://doc.daypilot.org/scheduler/height/
Set Text in Resource 2nd Columns
How we can set description/text on resource's second column on a button click. I understand on onBeforeResHeaderRender event, I can set description on second column but need to set dynamically. Below...
Scheduler Timeheader Date text 90 degree rotation
Answered: You can rotate the text using CSS: https://developer.mozilla.org/en-US/docs/Web/CSS/transform-function/rotate
Angular show() not working
Answered: In order to access the component using "this" you need to use the arrow function notation:
reSizeScheduler = () => {
this.scheduler.control.show();
}
See also: https://www.typescriptlan...
ivy - SchedulerModule angular 8
Answered: Hi Chris, Ivy + AOT is now supported in Angular 8 and Angular 9 (since build 2020.1.4238). Please let me know if there is any problem.
Vue.js: export and download scheduler as svg
Answered: If you follow this tutorial: https://code.daypilot.org/69423/vue-js-scheduler-build-a-reservation-application-in-5-minut you will be able to access the DayPilot.Scheduler object as "this.scheduler". ...
Why daypilot lines are not aligned?
Answered: This is most likely caused by CSS interference. I recommend turning off all global CSS to verify that. The most common problems include global "padding", "border" or "box-sizing" styles. If the probl...