A component that lets you schedule, view, and manage appointments across multiple calendar views. Supports Day/Week/Month/MultiDay/Timeline/Agenda views, navigation, grouping by resources, all-day items, recurrence (rules/exceptions), custom item and cell templates, CRUD with confirm delete, loader overlay, keyboard navigation, and state APIs for programmatic refresh and rebind. Children: SchedulerViews, SchedulerResources, SchedulerSettings.
Definition
Namespace:Telerik.Blazor.Components
Assembly:Telerik.Blazor.dll
Type Parameters:
TItem
Syntax:
public class TelerikScheduler<TItem> : BaseComponent, IComponent, IHandleEvent, IHandleAfterRender, IDisposableInheritance: objectComponentBaseBaseComponentTelerikScheduler<TItem>
Implements:
Inherited Members
Constructors
public TelerikScheduler()Methods
protected override void BuildRenderTree(RenderTreeBuilder __builder)Overrides:
public override void Dispose()Overrides:
GetTimeSlotFromDropIndex(string)
TimeSlot
protected virtual Dictionary<string, object> GetWidgetOptions()Processes the available data with applied all data operations. Useful in scenarios where the data might change from an outside source. If the component contains OnRead, the method triggers the event so that fresh data can be supplied.
public virtual void Rebind()Re-renders the component.
public void Refresh()public override Task SetParametersAsync(ParameterView parameters)Overrides:
Properties
Customizes the visual appearance of all-day appointments. Receives the appointment data object as context. Used specifically for appointments marked as all-day in Day, Week and MultiDay views. These appointments appear in a dedicated section above the hourly time slots.
[Parameter]
public RenderFragment<object> AllDayItemTemplate { get; set; }Controls whether users can create new appointments in the Scheduler. When enabled, users can create appointments by double-clicking empty time slots or using the toolbar. Requires the OnCreate event handler to persist new appointments.
[Parameter]
public bool AllowCreate { get; set; }Controls whether users can delete existing appointments from the Scheduler. When enabled, users can remove appointments through context menus or keyboard shortcuts. Requires the OnDelete event handler to complete the deletion.
[Parameter]
public bool AllowDelete { get; set; }Controls whether users can edit existing appointments in the Scheduler. When enabled, users can modify appointments by double-clicking them or using context menus. Requires the OnUpdate event handler to save changes.
[Parameter]
public bool AllowUpdate { get; set; }Controls whether appointment deletion requires user confirmation. When enabled, shows a confirmation dialog before proceeding with deletion. Helps prevent accidental appointment removal.
[Parameter]
public bool ConfirmDelete { get; set; }Data
IEnumerable<TItem>
Provides the appointment data that populates the Scheduler. Should be a collection of objects containing appointment information like title, start/end times, and other properties. The field names are configurable through properties like TitleField, StartField, and EndField.
[Parameter]
public IEnumerable<TItem> Data { get; set; }Sets the currently displayed date in the Scheduler. Determines which time period is visible based on the selected View. For example, in Day view shows that specific day, in Month view shows the month containing this date.
[Parameter]
public DateTime Date { get; set; }Fires when the user navigates to a different date through the toolbar navigation or date picker. Provides the new selected date that determines the visible time period.
[Parameter]
public EventCallback<DateTime> DateChanged { get; set; }Specifies which property contains detailed appointment information in your data objects. Typically used in the edit form to provide additional context about the appointment. Example: "Details" or "Notes".
[Parameter]
public string DescriptionField { get; set; }[CascadingParameter]
public DialogFactory DialogFactory { get; set; }Controls whether a loading overlay appears during data operations and view changes. When enabled, provides visual feedback during appointment creation, updates, deletions, and view transitions.
[Parameter]
public bool EnableLoaderContainer { get; set; }Enables WebMCP tool registration for this Scheduler. When true, Scheduler operations are exposed as tools discoverable by AI models through the browser.
Configure tool names and overrides via SchedulerWebMcpSettings inside SchedulerSettings.
[Parameter]
public bool EnableWebMcpTools { get; set; }Specifies which property contains the appointment end date and time in your data objects. Must be a DateTime value that determines when the appointment ends. Example: "EndDate" or "FinishTime".
[Parameter]
public string EndField { get; set; }public int FocusedIndex { get; set; }Controls the height of the Scheduler component. Accepts CSS values like "400px", "100%", or "50vh". Setting the height enables proper scrolling behavior.
[Parameter]
public string Height { get; set; }Sets the unique HTML id attribute for the Scheduler component. Useful for custom styling, accessibility, or JavaScript integration. Example: "my-scheduler".
[Parameter]
public string Id { get; set; }Specifies which property contains the unique identifier for appointments in your data objects. Required for proper CRUD operations and appointment tracking. Should be a unique value per appointment. Example: "AppointmentId" or "EventId".
[Parameter]
public string IdField { get; set; }Specifies which property indicates whether an appointment spans the entire day in your data objects. Must be a boolean value. All-day appointments appear in a dedicated section above time slots in Day, Week, and MultiDay views. Example: "AllDay" or "FullDay".
[Parameter]
public string IsAllDayField { get; set; }Customizes the visual appearance of regular appointments in all views. Receives the appointment data object as context. Use this to display appointment details beyond the default title. Applied to appointments in the main time section of Day, Week, and MultiDay views, and all appointments in Month, Timeline, and Agenda views.
[Parameter]
public RenderFragment<object> ItemTemplate { get; set; }Fires when a user cancels an edit or create operation by closing dialogs without saving. Use this event to perform cleanup operations or revert any temporary changes made during the editing process.
[Parameter]
public EventCallback<SchedulerCancelEventArgs> OnCancel { get; set; }Fires during time slot rendering to allow custom styling of calendar cells. Use this to highlight specific dates, mark holidays, or apply conditional styling based on date properties. Called for each visible time slot in the current view.
[Parameter]
public Action<SchedulerCellRenderEventArgs> OnCellRender { get; set; }Fires when a user creates a new appointment through double-clicking time slots or using the toolbar. Handle this event to add the new appointment to your data source. The event provides the appointment details entered by the user.
[Parameter]
public EventCallback<SchedulerCreateEventArgs> OnCreate { get; set; }Fires when a user confirms deletion of an appointment through context menus or keyboard shortcuts. Handle this event to remove the appointment from your data source. The event provides the appointment data to be deleted.
[Parameter]
public EventCallback<SchedulerDeleteEventArgs> OnDelete { get; set; }Fires when a user attempts to edit an appointment by double-clicking it or accessing edit through context menus. Cancel this event to prevent the edit dialog from opening. Use this for conditional editing based on appointment properties or user permissions.
[Parameter]
public EventCallback<SchedulerEditEventArgs> OnEdit { get; set; }Fires when a user clicks on an appointment in any view. Use this event to show appointment details, trigger custom actions, or handle appointment selection. Provides the clicked appointment data and mouse event information.
[Parameter]
public EventCallback<SchedulerItemClickEventArgs> OnItemClick { get; set; }Fires when a user right-clicks on an appointment to trigger context menu actions. Use this event to show custom context menus or handle right-click behaviors specific to appointments. Provides the right-clicked appointment data and mouse event information.
[Parameter]
public EventCallback<SchedulerItemContextMenuEventArgs> OnItemContextMenu { get; set; }Fires when a user double-clicks on an appointment in any view. By default, double-clicking opens the edit dialog. Use this event for custom double-click behavior. Provides the double-clicked appointment data and mouse event information.
[Parameter]
public EventCallback<SchedulerItemDoubleClickEventArgs> OnItemDoubleClick { get; set; }Fires during appointment rendering to allow custom styling based on appointment data. Use this to add CSS classes, modify appearance, or set conditional styling based on appointment properties. Called for each visible appointment in the current view.
[Parameter]
public Action<SchedulerItemRenderEventArgs> OnItemRender { get; set; }OnModelInit
Func<TItem>
Provides a factory function for creating new appointment instances when the default constructor is unavailable. Called during appointment creation to initialize new data objects with default values or required properties. If not specified, the component uses Activator.CreateInstance to create new appointment objects.
[Parameter]
public Func<TItem> OnModelInit { get; set; }Fires when a user saves changes to an existing appointment through the edit dialog. Handle this event to update the appointment in your data source. The event provides both original and modified appointment data.
[Parameter]
public EventCallback<SchedulerUpdateEventArgs> OnUpdate { get; set; }Specifies which property contains dates when recurring appointments should be skipped in your data objects. Used to exclude specific occurrences from recurring appointment series. Should be a collection of DateTime values. Example: "ExceptionDates" or "SkippedDates".
[Parameter]
public string RecurrenceExceptionsField { get; set; }Specifies which property contains the parent appointment ID for recurring appointment exceptions in your data objects. Links exception appointments to their parent recurring series using the parent's IdField value. Example: "MasterEventId" or "ParentAppointmentId".
[Parameter]
public string RecurrenceIdField { get; set; }Specifies which property contains recurrence pattern rules in your data objects. Used for repeating appointments. Should contain recurrence rule strings in standard format. Example: "RecurrenceRule" or "RepeatRule".
[Parameter]
public string RecurrenceRuleField { get; set; }Resources
Dictionary<string, Resource>
public Dictionary<string, Resource> Resources { get; set; }Defines the container for the Scheduler resources. Children: SchedulerResource tags.
[Parameter]
public RenderFragment SchedulerResources { get; set; }Defines the container for the Scheduler settings. Children: SchedulerGroupSettings.
[Parameter]
public RenderFragment SchedulerSettings { get; set; }Defines the container for the Scheduler toolbar that appears above the calendar views. Contains navigation controls, date picker, and view selection tools. When not specified, displays default navigation and view selection tools. Children: SchedulerToolBarCustomTool, SchedulerToolBarNavigationTool, SchedulerToolBarCalendarTool, SchedulerToolBarViewsTool .
[Parameter]
public RenderFragment SchedulerToolBar { get; set; }Defines the container for the Scheduler views. Children: SchedulerDayView, SchedulerWeekView, SchedulerMultiDayView, SchedulerMonthView, SchedulerTimelineView, SchedulerAgendaView.
[Parameter]
public RenderFragment SchedulerViews { get; set; }SelectedView
ISchedulerView
public ISchedulerView SelectedView { get; }Specifies which property contains the appointment start date and time in your data objects. Must be a DateTime value that determines when the appointment begins. Example: "StartDate" or "BeginTime".
[Parameter]
public string StartField { get; set; }Specifies which property contains the appointment title text in your data objects. The title appears as the main text displayed within appointments in all views. Example: "Subject" or "EventName".
[Parameter]
public string TitleField { get; set; }Controls which calendar view is currently active in the Scheduler. Day displays a single day with hourly time slots. Week shows a full week with daily columns. Month presents a monthly calendar view. MultiDay displays a custom number of days side by side. Timeline shows appointments in a horizontal timeline format. Agenda presents appointments in a list format.
[Parameter]
public SchedulerView View { get; set; }Fires when the user switches between different calendar views using the toolbar view selector. Provides the newly selected SchedulerView that determines the layout and time period display.
[Parameter]
public EventCallback<SchedulerView> ViewChanged { get; set; }