JavaScript/jQuery Scheduler - Overview

DevExtreme Scheduler is a UI scheduling component used to implement flexible data binding, easy appointment editing, multiple calendar views, time zone support, and more.

In this overview, you can find a map of Scheduler elements, information about key features, and what to explore next.

1. "Today" button
2. Date navigator
3. View switcher
4. Work week view
5. All-day appointments
6. One-time appointment
7. Recurring appointment
8. Custom appointment

• Event creation and management
  DevExtreme Scheduler supports the following operations with appointments:

  • Add
  • Update
  • Delete
  • Drag-and-drop (to reschedule)
  • Resize (to change appointment duration)

• Types of appointments
  Scheduler allows you to create the following appointment types:

  • One-time
  • All-day
  • Recurring

• Variety of views
  The Scheduler component includes multiple view types:

  • Day
  • Week and work week
  • Month
  • Timeline (day, work week, week, month)
  • Agenda

• Resources
  Scheduler allows you to assign appointments to a set of predefined resources. Multiple resources may be available. You can also group appointments by resources.

• Customization
  You can customize a variety of Scheduler elements:

  • Appointment
  • Appointment tooltip
  • Appointment edit form
  • View
  • Resource headers
  • Cell overflow indicator
  • Timetable
  • etc.

• Time zone support
  Specify a different time zone for the entire Scheduler or individual appointments.

• Lazy loading
  If Scheduler performance suffers due to a high number of appointments, you can lazy load data.

• Disable date/time ranges
  Disable certain days, dates, and times to prevent scheduling conflicts.

• Virtual scrolling
  Enabling virtual scrolling in Scheduler speeds up load times by displaying only visible appointments. Ideal for large datasets.

• Getting Started with Scheduler

• API

• Demos