All Tutorials

How to add a zoom feature to the Angular Scheduler component.

Angular 14 application that uses DayPilot Navigator component as a date picker for the Scheduler.

The React Scheduler allows defining the callout (bubble) content as a React JSX component. The component will be created automatically when the callout is activated and removed and unmounted when the callout is hidden.

Learn how to enable drag and drop column reordering and resizing for the JavaScript resource calendar component.

How to use the JavaScript Scheduler keyboard API to define custom hotkeys and override the default behavior.

How to define custom time segments in the Scheduler time headers. In this example, we will display a special header that will highlight work weeks and weekends.

How to mark selected days as disabled and prevent adding, moving, and resizing events. You can use this technique to disable days in the past, weekends, holidays or other dates.

ASP.NET application that allows creating courtroom reservations from a list of unscheduled cases using drag & drop.

How to add custom components to events displayed in the Angular Scheduler.

Simple appointment scheduling application built using Angular. The calendar view is created using DayPilot Pro Angular Calendar component. The server-side backend is created using PHP and stores events in a MySQL or SQLite database.