KendoReact DateInput Overview

The KendoReact DateInput represents an input field that recognizes and formats scheduling values such as dates.

The KendoReact DateInput component is part of the KendoReact library of React UI components. It is distributed through NPM under the kendo-react-dateinputs package.


The following example demonstrates the DateInput in action.

Example
View Source
Edit In Stackblitz  
Change Theme:

The DateInput is part of the KendoReact Date Inputs component library. The procedures for installing, importing, and using the Date Inputs are identical for all components in the package. To learn how to use the DateInput and the rest of the Date Inputs, see the Getting Started with the KendoReact Date Inputs guide.

Key Features

  • Disabled stateTo prevent users from interacting with the DateInput, you can render it in a disabled state until specific requirements are met.
  • Spin buttonsThe end-users can take advantage of the intuitive spin buttons that increase or decrease the selected date by a predefined step.
  • Incremental stepsYou can adjust the default step for increasing and decreasing each part of the date values.
  • Date limitsYou can configure a specific date limit that allows the user to select a date only within that predefined range.
  • FormatsThe format property allows you to control how the DateInput displays the dates.
  • Placeholders The DateInput allows you to render a text hint, floating label, and provide descriptions for its date format sections.
  • Forms SupportWith the forms, you can validate input values and prevent the submission of incomplete or invalid forms.
  • GlobalizationThe DateInput comes with globalization features allowing you to create applications that can be used all over the world.
  • Keyboard navigationThe DateInput supports various keyboard shortcuts that allow users to interact with the component.
  • AccessibilityThe DateInput is accessible for screen readers and provides full WAI-ARIA support.

In this article

Not finding the help you need?