CRUD Actions: Add, Edit, Delete Events in the React Scheduler

Events (also called appointments) are the primary interactive elements in the Scheduler. Create, update, and remove appointments using the editor dialog, quick info popup, or drag-and-drop and resize actions directly on the calendar.

Add new events

Create appointments by clicking a scheduler cell to open the quick info popup or double-clicking to open the detailed editor dialog. Prevent new event creation by setting allowAdding={false}.

Edit existing events

Modify appointments using the detailed editor dialog (double-click) or quick info popup (single-click); changes take effect immediately upon save. Prevent event editing by setting allowEditing={false}.

Delete events

Remove appointments from the quick info popup (single-click) or by pressing the Delete key, with a confirmation prompt. Prevent event deletion by setting allowDeleting={false}.

Dynamic CRUD operations

This example demonstrates how to dynamically toggle CRUD operations (Add, Edit, Delete) in the Scheduler using property controls.