ui-for-blazor-lp-pages-herobanner

Progress Telerik UI for Blazor

DatePicker

  • Blazor DatePicker Overview

    The Blazor DatePicker component enables the user select and enter only a valid date from a calendar panel that conforms to the specified format, culture, min and max settings. The DatePicker works in both (WASM) and Server-side Blazor apps and also supports forms validation, keyboard navigation and provides events.

    The user is presented with a calendar popup they can use to navigate in a visual manner to choose the desired date.

    Telerik.Sitefinity.Libraries.Model.Image..AlternativeText
  • DatePicker Disabled Dates

    If there are dates the user must not pick, because they are a bank holiday or otherwise a special day, you can disable them by providing a simple list of them to the Telerik DatePicker.

    Example of disabled dates in the Blazor DatePicker

    Telerik.Sitefinity.Libraries.Model.Image..AlternativeText
  • DatePicker Supported Date Formats

    The Telerik Blazor DatePicker restricts input to the format specified by the developer. This ensures a valid date, and full control over the display.

    You can choose from the standard .NET format specifiers, and to also write your own – just like you would with any C# code.

    Telerik.Sitefinity.Libraries.Model.Image..AlternativeText
  • DatePicker Validation

    Form validation through DataAnnotation attributes comes out-of-the-box with the Telerik Blazor Date Picker.

    Telerik.Sitefinity.Libraries.Model.Image..AlternativeText
  • DatePicker Events

    The DatePicker offers the standard ValueChanged event and also an OnChange event that still lets you react to the user choosing a new date, but does not prevent two-way binding.

    Telerik.Sitefinity.Libraries.Model.Image..AlternativeText
  • DatePicker Globalization and Localization

    The Telerik DatePicker automatically carries culture-aware formats to the client so users see the dates they are used to – for example, if you set the format to “d” people in the US can see MM/dd/yyyy while people in the UK can see dd/MM/yyyy. Days of the week and button texts are easily translatable to any language.

    Telerik.Sitefinity.Libraries.Model.Image..AlternativeText
  • DatePicker Accessibility and Keyboard Navigation

    The Telerik DatePicker component honors web accessibility standards (WCAG, Section 508 and WAI-ARIA attributes for screen readers) and lets you enter values with the keyboard only – not only by typing, but also by pressing the arrow keys, which includes navigation in the calendar popup as well – all without ever touching the mouse.

    Telerik.Sitefinity.Libraries.Model.Image..AlternativeText
  • DatePicker Theming

    The Telerik Blazor DatePicker has several built-in themes such as Default (our own styling), Material (based on the Material Design guidelines) and Bootstrap (which looks like the Bootstrap styling to integrate better). You can easily customize any of out-of-the-box themes with a few lines of CSS, or create new theme to match your colors and branding by using the Telerik SASS ThemeBuilder application.

    Telerik.Sitefinity.Libraries.Model.Image..AlternativeText

Next Steps

Launch demos

See Telerik UI for Blazor in action and check out how much it can do out-of-the-box.

Download free trial

Try Telerik UI for Blazor with dedicated technical support.