Questions Tagged
Gantt View: scrollable context menu or a button to expand
Answered: At this moment, the vertical scrollbar is not implemented. Just adding the CSS isn't enough as the calculated height needs to be taken into account. I recommend splitting the long list into several g...
Insert another textarea
Answered: You can use a custom modal dialog and add as many field as needed. Here is an example:
async function modalText() {
const form = [
{name: "Name", id: "name", type: "text"},
{name: "D...
DayPilot.Modal.close Not Working
Answered: In order to access objects from the "DayPilot" namespace, you need to include "daypilot-all.min.js". In this case, this means you need to include it in both pages (in the main page and in the modal c...
Unable to dp.init() in Lightning Web Component
Answered: LWC uses virtual DOM so you will need to adjust the code a bit. 1. Make sure that the init code is in renderedCallback(). This ensures that the placeholder will be available. 2. The DayPilot.Schedule...
Salesforce Compatibility
Answered: It should be no problem. You'll need to follow this Salesforce guide for using third-party libraries: https://developer.salesforce.com/docs/component-library/documentation/en/lwc/lwc.js_third_party_l...
How to set two input field in one row
Answered: The modal dialog form is designed to display one field per row. You might be able to adjust the CSS to display two fields per row but it is not supported out of the box at the moment.
Gantt View: Is it possible to have more that one progress bars for the Gantt task
Answered: Yes, you can add a custom progress bar using active areas. This approach is outlined in this tutorial (it's for React and Scheduler but the same logic can be used in the Gantt chart component): https...
PHP 8.1 support
Answered: In the Scheduler, events will only be displayed if the "resource" property value of an event matches the row id as specified in "resources" array, "id" property. The values need to match exactly, i.e...
Recurrent events
Answered: You can display recurrent events (and add the necessary icons) but you need to handle the recurrence definition and storage on the server side. The calendar needs to receive the individual occurrence...
how to select multiple value in form dropdown
Answered: Unfortunately, it is not possible to select multiple options from the drop down list (type: "select" or type: "searchable"). I recommend using a set of checkboxes instead (type: "checkbox").
Honoring grid layout
Answered: This seems to be caused by the wrapper divs that you use to display the columns for DayPilotNavigator and DayPilotCalendar. The tutorial uses "display: flex" to arrange these components but your code...
How to not show non business Hours in DayPilotCalendar
Answered: You can hide non-business hours using the heightSpec property:
const calendar = new DayPilot.Calendar("dp", {
heightSpec: "BusinessHoursNoScroll",
//...
});
calendar.init();
See also: htt...
JavaScript Scheduler Model Custome date selection
Answered: You can use the "dateFormat" property of the date field:
const resources = [
{name: "Resource A", id: "A"},
{name: "Resource B", id: "B"},
{name: "Resource C", id: "C"},
];
const form ...
How to hide elements in the hours row?
Answered: This looks like the minute part which is included in the standard view. However, it doesn't display if you use timeHeaderCellDuration value other than 60. I recommend checking the onBeforeTimeHeaderR...
Evento useless in shade
Answered: You can disable time range selecting using the config:
{
timeRangeSelectedHandling: "Disabled",
// ...
}
If you want to use this feature to create new events, it is necessary to call clear...
Moving and resizing tasks was not explained
Answered: You can find the documentation here: Resizing: https://doc.daypilot.org/gantt/task-resizing/ https://api.daypilot.org/daypilot-gantt-ontaskresize/ Moving (horizontal): https://doc.daypilot.org/gantt/...
Loading pic
Answered: Probably the easiest solution would be to add a simple <img> element that you hide using CSS so it isn't visible by default. Then you can make it visible using a client-side click event handler (OnCl...
update is Undefined (Calendar)
Answered: The value of "this.$refs.calendar" will be null before the component is mounted. That means the computed "calendar()" method will return null as well. If you call "loadEvents()" too early it will thr...
How to load resources from an API and display them as rows in the scheduler?
Answered: You can load resources from an API like this:
async componentDidMount() {
const {data} = await DayPilot.Http.get(`/api/resources`);
this.setState({resources: data});
}
The returned d...
Scheduler - Frozen rows are not processed in onRowFilter
Answered: Frozen rows are now supported by the row filter in the latest sandbox build (2023.1.5544). The documentation is updated as well: https://doc.daypilot.org/scheduler/frozen-rows/
How to implement row-up and row-down in gantt view.
Answered: Sorry for the confusion. You can do this by changing the order of tasks in the data source (it's stored in dp.tasks.list). Then call update() to apply the changes.
Max Events
Answered: This example uses onBeforeCellRender to customize the monthly calendar cells. It adds the action button using an active area. In Angular, it could look like this:
onBeforeCellRender: (args) => {
...
508 Compliant
Answered: The Scheduler provides the following tools to help you make it accessible: the Scheduler elements (main areas, items) are marked with "aria-label" attributes you can enable keyboard support (https://...
Button with bind action angular
Answered: I assume you mean the modal dialog: Unfortunately, Angular components in the form items are not supported at the moment.
Getting error while downloading a range image
Answered: This issue should be fixed now in the latest sandbox build (2023.1.5540): https://release.daypilot.org/changes/js/ Please let me know if the problem persists.
Display Icon in options on Modal form
Answered: At this moment, icons can't be displayed in <select> items - it uses the standard browser element and that doesn't support HTML in <option> elements. You can implement your own form item type using p...
Zoom
Answered: There is now a new zoom API available in the latest sandbox build (2023.1.5540). See also: https://release.daypilot.org/changes/js/ The API docs and a tutorial are coming soon.
month_transparent_event_hover repeating
Answered: It looks like you have modified the source code - you should use the original (commented-out in your screenshot) regex:
var already = new RegExp("(^|\\s)" + name + "($|\\s)");
Quick way to set background color of cells in DayPilotScheduler
Answered: The BeforeCellRender event is fired for every cell and it needs to be kept as efficient as possible. It is not possible to run a new database query in every invocation. I recommend running a single q...