Questions Tagged javascript

Answered: There are a couple of issues with this example: 1. If you set args.async = true, you must call args.loaded() in every code path. Otherwise the dragging operation will remain active. The first "if" bl...

Answered: DayPilot Pro for ASP.NET WebForms version 8.0.3413 is from 2015 and it is not supported anymore.

Answered: This seems to be fine and a static version of your sample works well in my tests: dp.events.list = [ { id: DayPilot.guid(), text: '', resource: "frozen1", start: "2022-02-01", end: "2022-02-10", back...

Answered: This is a global setting but you can implement custom rules using the real-time drag and drop events: https://api.daypilot.org/daypilot-scheduler-oneventmoving/ https://api.daypilot.org/daypilot-sche...

Answered: The calculated value is stored in cellWidth: https://api.daypilot.org/daypilot-scheduler-cellwidth/

Answered: You can do it like this: { visibility: "Visible", bottom: 0, right: 0, width: 0, height: 0, style: "border-bottom: 6px solid #006600; border-left: 6px solid transparent;" }

Answered: The Scheduler component introduced a new configuration property (rowHeaderColumnsMergeParents) and the Gantt chart inherited the default value: https://api.daypilot.org/daypilot-scheduler-rowheaderco...

Answered: It is not possible to set border-radius using a special property at the moment. However, you can can use cssClass to set multiple classes (separated by space).

Answered: I recommend using the browser devtools to check the DOM structure. If an event is partially hidden (outside of the current viewport), the Scheduler adds a special <div> element with "scheduler_defaul...

Answered: At this moment, the Calendar component uses fixed time blocks but it is possible to use a workaround and map the block number to the hour/minute part of the start/end time. This approach is used in t...

Answered: Task filtering is now available in the latest sandbox build (since version 2022.4.5449): https://doc.daypilot.org/gantt/row-filtering/

Answered: It depends on what "will not work" means - the field is read-only, can't be focused, you can't type in the field, the new value is not available in modal.result? I recommend inspecting the <input> el...

Answered: For this, you need to create one more button 'Today Button' and create one function for the today button and write your logic on this. todayDate() { this.configMonth.startDate = DayPilot.Date.today()...

Answered: Thanks for the update. To detect that a row has been rendered, you can use onBeforeRowHeaderRender event: https://api.daypilot.org/daypilot-scheduler-onbeforerowheaderrender/ You can also increase th...

Answered: All main components (Calendar, Month, Scheduler) provide visibleStart() and visibleEnd() methods that you can use to get the start and end of the current date segment (calculated from startDate/days)...

Answered: When using the default theme, the Scheduler events are marked with "scheduler_default_event" CSS class (the outer div) and "scheduler_default_event_inner" (the inner div): .scheduler_default_event_in...

Answered: The Scheduler cells are marked with "scheduler_default_cell" CSS class (when using the default theme): .scheduler_default_cell { font-weight: bold; } See also: https://doc.daypilot.org/scheduler/css-...

Answered: You can add the icon using an active area which lets you specify an onClick handler. Active areas are supported in time headers, row headers, events, and cells. Here you can find an example of a row ...

Answered: Adding event listeners to Scheduler elements using global selectors is not a supported scenario. The Scheduler needs to update individual elements as needed. Instead, use the provided render event ha...

Answered: In the monthly calendar, it's necessary to use cellHeight : https://api.daypilot.org/daypilot-month-cellheight/

Answered: At this moment, the React Scheduler will always update on state changes. This is a design decision and the alternative would be to perform a deep comparison of the current/previous props. The props c...

Answered: Thanks for the update. It should be fixed now in the latest sandbox build (2022.3.5440): https://release.daypilot.org/changes/js/ Please let me know if the problem persists.

Answered: You can use onEventMoving event handler to customize the Scheduler drag and drop event moving in real time: https://doc.daypilot.org/scheduler/event-moving-customization/

Answered: I'm not sure what exactly you are trying to achieve but here are the related options: 1. You can specify the vertical position of an event inside a row manually: https://code.daypilot.org/91222/javas...

Answered: Please take a look at this tutorial: https://code.daypilot.org/97538/javascript-scheduler-displaying-group-availability

Answered: If you are a licensed user of DayPilot Pro, you can get a special NPM link in the customer area at https://www.daypilot.org/customers/ . If there is any problem please contact us by email at support@...

Answered: There turned out to be a problem with Vue 2.7. It should be fixed now in the latest sandbox build (2022.3.5436): https://release.daypilot.org/changes/js/ Please let me know if the problem persists.

Answered: Yes - one of the options is to use the built-in modal dialog which supports creation of custom forms: https://modal.daypilot.org/ You can also use a third-party form that you open using onEventClick ...

Answered: You can take a look at this tutorial: https://code.daypilot.org/44666/html5-doctor-appointment-scheduling-javascript-php It uses pre-generated slots that are offered to users for making appointments....

Answered: This is fixed now in the latest sandbox build (2022.4.5455): 1. The splitter for the last column is accessible. 2. Resizing columns when the outer width is set to the max updates the outer width auto...