Example of Recurring Events in React Scheduler Component


This demo showcases the scheduler with recurring meetings handled by a top-level manager on a regular pattern.

More Details...


In this demo, the recurrence events are defined with different repeat patterns. It can be defined through recurrenceRule field which should accept the valid rule string following the iCalendar specifications. The recurring events are differentiated from other events by a repeat marker added to the right-bottom of it. These events can repeat on daily, weekly, monthly or yearly basis.

Here, the daily patterned events are depicted in blue color, weekly events are differentiated with green color, monthly events are depicted in orange color and the yearly event is depicted in the all-day section with another green shade for reference.

Scheduler requires only the startTime and endTime fields as mandatory to be mapped from the dataSource. The Scheduler events can be categorized into 3 types based on its time range and all-day type.

Event Description
Normal events The events that has its start and end time duration on the same date.
Spanned events The events on which its start and end time spans over multiple days and usually displays together with all-day events.
All-day events The events that are defined as all-day in its event object by setting isAllDay to true. It usually renders at the date header section of the Scheduler where no time-cells are present.