Telerik UI for ASP.NET Core DatePicker Overview

Loading Demo...
  • EXAMPLE
  • VIEW SOURCE
  • Edit in Telerik REPL
HtmlHelper
TagHelper
Files:
index.cshtml
IndexController.cs
Index_TagHelper.cshtml

Also available for:

CLIENT-SIDE API SERVER-SIDE API
devcraft ninja image

The DatePicker component is part of Telerik UI for ASP.NET Core, a professional grade UI library with 110+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.

Description

The Telerik UI for ASP.NET Core DatePicker is a component that allows users to select dates from a calendar through a direct input in ASP.NET Core applications. The component enables you to use custom templates for its Month view, set minimum and maximum dates, a start view, and a depth for its calendar navigation.

As of the R2 2017 release, the DatePicker can use a Telerik UI for ASP.NET Core DateInput as its default input.

The first example displays a common use-case scenario for a DatePicker component with minimum configuration settings, while the second demo is configured with a specified depth, format, start view, and displays a DateInput as a default input.

The ASP.NET Core DatePicker control is part of Telerik UI for ASP.NET Core, a professional-grade UI library with 110+ components for building modern and feature-rich web applications. The DatePicker is a server-side wrapper for the Kendo UI for jQuery DatePicker component and supports an HtmlHelper and a TagHelper mode.

Functionality and Features

  • Disabled dates—The DatePicker allows you to disable specific days that are not intended for user interaction.
  • Selected dates—The DatePicker allows you to render a pre-selected date upon loading.
  • Start view and navigation depth—You can also set the initial view the DatePicker renders and define the navigation depth of its views.
  • Validation—The DatePicker keeps its input value unchanged even when the typed date is invalid.
  • Calendar types—Even though, by default, the DatePicker supports only the Gregorian calendar, you can still work around this behavior and render other calendar types.
  • Week number column—The DatePicker provides options for rendering a column which displays the number of the weeks within the current Month view.
  • DateInput integration—The fluent integration between the DatePicker and the DateInput allows you to take advantage of the natively available features of both components.
  • Templates—You can customize the content and look and feel of the DatePicker by utilizing templates.
  • Accessibility—The DatePicker is accessible for screen readers, supports WAI-ARIA attributes, delivers keyboard shortcuts for faster navigation, and allows you to render it in a right-to-left direction.

Additional Apps

This DatePicker example is part of unique collection of hundreds of ASP.NET Core demos, with which you can see all Telerik ASP.NET Core components and their features in action. View the source code of the demos from the library or directly adapt, and edit them and their theme appearance in Telerik REPL for ASP.NET Core or ThemeBuilder.

Support & Learning Resources

Additional Resources