Drag and Drop Events in the React Scheduler

Reschedule appointments by dragging and dropping them to new time slots. Drag-and-drop is enabled by default (eventDrag={true}). Set eventDrag={false} to disable dragging.

On mobile devices, tap and hold an event, then drag it to the desired location.

Drag and drop lifecycle events

Three callbacks manage the drag lifecycle:

• onDragStart: Fires when dragging begins. Use it to cancel the drag, enforce restrictions, or provide visual feedback.
• onDrag: Fires continuously during dragging. Use it for real-time validation or updating dependent UI elements.
• onDragStop: Fires when dragging ends. Use it for final validation or persisting changes to the data source.