# Display Modes

Validate date and time in the DateTimePicker control. Learn more about the date and time validation in Blazor documentation.

## Content



DateRangePicker control allows you to control its editability and state. This can be useful in the scenarios where you want limit the user from modifying the control value until some other conditions have been met, like selecting a radio button or a checkbox. Let us explore more about these modes in the following sections.

## Disabled Mode

You can keep the DateRangePicker control in deactivated state by setting the [IsEnabled](/componentone/api/blazor/online-blazor/dotnet-api/C1.Blazor.DateTimeEditors/C1.Blazor.DateTimeEditors.C1DateTimeBase-1.IsEnabled.html) property to **false**. This allows you to inactivate the DateRangePicker control and limit any modifications.

![Disabled DateRangePicker](https://cdn.mescius.io/document-site-files/images/f5b600ba-f1a7-4f89-a20c-aa6c0c35880d/images/daterangepicker-disabled-mode.png)

To disable the DateRangePicker control using the **IsEnabled** property, use the following code:

```razor
<C1DateRangePicker Placeholder="Select a date range" IsEnabled="false"></C1DateRangePicker>
```

## ReadOnly Mode

DateRangePicker provides the [IsReadOnly](/componentone/api/blazor/online-blazor/dotnet-api/C1.Blazor.DateTimeEditors/C1.Blazor.DateTimeEditors.C1DateTimeBase-1.IsReadOnly.html) property which lets you choose whether to allow the user to modify the control value with the mouse and keyboard at runtime. To make the DateRangePicker control non-editable, set the **IsReadOnly** property to true, as shown in the following code:

```razor
<C1DateRangePicker Placeholder="Non-Editable DateRangePicker" IsReadOnly="true"></C1DateRangePicker>
```