How to disable the DateRangePicker in Blazor DateRangePicker

14 Aug 20261 minute to read

The DateRangePicker can be deactivated on a page. Setting the Enabled property to false will disable the component completely from all user interactions, including form submission. The default value of the Enabled property is true. To allow users to view the value without editing it, use the Readonly property instead. The following sample demonstrates the disabled DateRangePicker.

@using Syncfusion.Blazor.Calendars

<SfDateRangePicker TValue="DateTime?" Enabled=false StartDate="@Start" EndDate="@End"></SfDateRangePicker>

@code {
    public DateTime? Start { get; set; } = new DateTime(DateTime.Now.Year, DateTime.Now.Month, 20);
    public DateTime? End { get; set; } = new DateTime(DateTime.Now.Year, DateTime.Now.Month + 1, 25);
}

Disable State in Blazor DateRangePicker

NOTE

You can refer to our Blazor Date Range Picker feature tour page for its groundbreaking feature representations. You can also explore our Blazor Date Range Picker example to understand how to present and manipulate data.