Questions Tagged javascript

Answered: I haven't seen this problem before. Unless you are doing something special on onBeforeHourRender, it will be a problem with the compilation/minification performed by your version of React. React 15 w...

Answered: It is possible to change "start" end "end" properties of the additional selected events in onEventMoving. You can modify the args.multimove[x].start and args.multimove[x].end properties as needed. Ju...

Answered: OK, I have the script running and incorporated within my scheduler. Much trial and error! I now have another issue. My Scheduler draws its information from an access database. The scheduler then writ...

Answered: There is now a Vue Composition API example available in the documentation: https://doc.daypilot.org/calendar/vue-js/ Here is a shortened version that shows how to access the DayPilot.Calendar object ...

Answered: The `window.open()` function is the correct approach: {text: "Job Card", onClick: args => window.open(args.source.data.Filelocation, '_blank')}, But if the browser is set to block popup windows it wi...

Answered: Hi Dan Thanks for the tip. I actually worked it out last night and then felt pretty thick for missing it. I'm developing on a company intranet and the tablet I was testing on was was not added to the...

Answered: You can customize the business hours using businessBeginsHour and businessEndsHour propertes. See also: https://doc.daypilot.org/scheduler/business-hours/

Answered: It is only available as a package. You can find the pricing details at the Buy page ( https://javascript.daypilot.org/buy/ ). If you have any questions regarding licensing or if you need a PDF quote,...

Answered: 1. First, you need to load the link from the database and store it as an additional property of the event data object. This can be done in the backend API endpoint that returns events. In most PHP ex...

Answered: In the latest sandbox build (2023.2.5562 - see https://release.daypilot.org/changes/js/ ), the args.column property now holds a DayPilot.Column object ( https://api.daypilot.org/daypilot-column-class...

Answered: This is not caused by the trial version. There should be no difference when someone other than the developer views the component. There are no error details visible in the screenshot but it it prints...

Answered: In Vue projects, you need to replace the NPM link in package.json with the one that you get in the customer area (a licensed version).

Answered: https://api.daypilot.org/daypilot-scheduler-eventtextwrappingenabled/

Answered: Please disregard, this has been solved. The scheduler was not initialize in the correct spot to make it globally available aboutside the rendered callback.

Answered: The cssClass property will be added in the next release. At this moment, you can apply custom class using the "theme" property. The theme name is used as a prefix for all classes used for menu elemen...

Answered: Yes, this is possible. Please see more here: https://doc.daypilot.org/calendar/all-day-events/

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...

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: "Description", id: ...

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...

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...

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...

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.

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...

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...

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...

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").

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...

Answered: You can hide non-business hours using the heightSpec property: const calendar = new DayPilot.Calendar("dp", { heightSpec: "BusinessHoursNoScroll", //... }); calendar.init(); See also: https://doc.day...

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 = [ {name: "Tex...

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...