# scheduler-recurring-events

> Scheduler demonstrates recurring appointments with bound date and view state for navigating repeated calendar events.

**Framework:** blazor  **Component:** Scheduler  **Variant:** recurring-events

## Get this item

**If you are an agent, fetch the JSON.** Source is inlined, so one request is enough and no tooling is required:

```
GET https://ai.syncfusion.com/r/blazor/scheduler-recurring-events.json
```

**Install Package(s)**

```bash
dotnet add package Syncfusion.Blazor.Schedule
```

**Notes**

- Syncfusion release: 2026 Volume 2 (v34.1.29)
- The Syncfusion package is licensed. The composition in this file is source you own and edit. See https://ai.syncfusion.com/licensing.md

## Source files

### src/components/scheduler-recurring-events/DataSource.cs

```cs
using System;
using System.Collections.Generic;

namespace BlazorDemos.Pages.Schedule.Scheduler
{
    public class ScheduleData
    {
        private readonly int CurrentYear = DateTime.Now.Year;

        public List<AppointmentData> GetRecurrenceData()
        {
            return new List<AppointmentData>
            {
                new AppointmentData
                {
                    Id = 1,
                    Subject = "Project demo meeting with Andrew",
                    Location = "Office",
                    StartTime = new DateTime(CurrentYear, 1, 8, 12, 0, 0),
                    EndTime = new DateTime(CurrentYear, 1, 8, 13, 0, 0),
                    RecurrenceRule = "FREQ=WEEKLY;INTERVAL=2;BYDAY=MO;COUNT=10",
                    CategoryColor = "#1aaa55",
                    Description = "Project demo meeting with Andrew regarding timeline"
                },
                new AppointmentData
                {
                    Id = 2,
                    Subject = "Scrum Meeting",
                    Location = "Office",
                    StartTime = new DateTime(CurrentYear, 1, 6, 9, 30, 0),
                    EndTime = new DateTime(CurrentYear, 1, 6, 10, 30, 0),
                    RecurrenceRule = "FREQ=WEEKLY;BYDAY=MO,TU,WE,TH,FR;INTERVAL=1",
                    RecurrenceException = CurrentYear + "0113T040000Z",
                    CategoryColor = "#357cd2",
                    Description = "Daily work plan discussion"
                },
                new AppointmentData
                {
                    Id = 3,
                    Subject = "General meeting",
                    Location = "Office",
                    StartTime = new DateTime(CurrentYear, 1, 10, 12, 0, 0),
                    EndTime = new DateTime(CurrentYear, 1, 10, 14, 0, 0),
                    RecurrenceRule = "FREQ=DAILY;INTERVAL=1",
                    CategoryColor = "#7fa900",
                    Description = "Future plans and possibilities"
                }
            };
        }

        public static Dictionary<string, object> ApplyCategoryColor(
            string categoryColor,
            Dictionary<string, object> attributes,
            Syncfusion.Blazor.Schedule.View currentView)
        {
            return new Dictionary<string, object>
            {
                ["style"] = currentView == Syncfusion.Blazor.Schedule.View.Agenda
                    ? "border-left-color: " + categoryColor
                    : "background: " + categoryColor
            };
        }

        public class AppointmentData
        {
            public int Id { get; set; }
            public string? Subject { get; set; }
            public string? Location { get; set; }
            public string? Description { get; set; }
            public DateTime StartTime { get; set; }
            public DateTime EndTime { get; set; }
            public bool? IsAllDay { get; set; }
            public string? CategoryColor { get; set; }
            public string? RecurrenceRule { get; set; }
            public int? RecurrenceID { get; set; }
            public string? RecurrenceException { get; set; }
        }
    }
}

```

### src/components/scheduler-recurring-events/Scheduler.razor

```razor
@page "/scheduler/recurrence-events"
@using BlazorDemos.Pages.Schedule.Scheduler
@using Syncfusion.Blazor.Schedule

<div class="col-lg-12 control-section">
    <SfSchedule TValue="ScheduleData.AppointmentData" Width="1200px" Height="500px" @bind-SelectedDate="@CurrentDate" @bind-CurrentView="@CurrentView">
        <ScheduleEvents TValue="ScheduleData.AppointmentData" EventRendered="OnEventRendered"></ScheduleEvents>
        <ScheduleViews>
            <ScheduleView Option="View.Day"></ScheduleView>
            <ScheduleView Option="View.Week"></ScheduleView>
            <ScheduleView Option="View.Month"></ScheduleView>
        </ScheduleViews>
        <ScheduleEventSettings DataSource="@dataSource" AllowEditFollowingEvents="@EditUpcoming"></ScheduleEventSettings>
    </SfSchedule>
</div>
@code{
    public View CurrentView { get; set; } = View.Week;
    private DateTime CurrentDate { get; set; } = new DateTime(DateTime.Today.Year, 1, 12);
    private bool EditUpcoming { get; set; } = false;
    private List<ScheduleData.AppointmentData> dataSource = new ScheduleData().GetRecurrenceData();
    public void OnEventRendered(EventRenderedArgs<ScheduleData.AppointmentData> args)
    {
        var categoryColor = args.Data?.CategoryColor ?? string.Empty;
        args.Attributes = ScheduleData.ApplyCategoryColor(categoryColor, args.Attributes, CurrentView);
    }
}
<style>
    .fabric .e-dialog .e-footer-content .e-btn,
    .fabric-dark .e-dialog .e-footer-content .e-btn {
        margin-left: 0px;
    }
</style>
```
