---
title: Usage
position: 2
seo_title: Guidelines for Using the DateInput Component
seo_description: Get the knack of the Telerik and Kendo UI DateInput and learn
  how to use and implement the component by following the instructions and
  recommendations in the user guidelines created by our designers.
---
## Usage Guidelines

The Telerik and Kendo UI DateInput is preferable in scenarios where the users are familiar with the date format and need to quickly and accurately type in specific dates. This approach is suitable for users who are comfortable with keyboard input and don't require the additional assistance of a calendar picker. It can be particularly useful in situations where the date format is standardized or widely known, reducing the need for extra interactions and streamlining the user experience.

The DateInput requires you to follow some basic principles when using the component.

### Text Label

The label of the DateInput provides a clear and concise description of its purpose, making it easier for users to interact with the interface and understand it. Always display a label unless the DateInput is next to another component that already has a label. The label of the DateInput can be set as part of the Telerik and Kendo UI Form component.

<DosDonts>
<Do description="Use a clear and concise text label to clarify the meaning of the DateInput.">![A Telerik and Kendo UI DateInput with a clear label](images/components-dateinput-usage-text-label-do.png "Use Telerik and Kendo UI DateInput components with clear and concise labels.")</Do>
<Dont description="Avoid using the DateInput without a label unless it is part of a complex scenario, where the context is already set. ">![A Telerik and Kendo UI DateInput with a missing label](images/components-dateinput-usage-text-label-dont.png "Don't use the Telerik and Kendo UI DateInput without a label.")</Dont>
</DosDonts>


### Placeholder

The placeholder text in the DateInput component plays a crucial role in guiding users to input dates correctly. A well-crafted placeholder can provide clear instructions or example dates, enhancing user understanding and interaction with the component.

<DosDonts>
<Do description="Use a descriptive placeholder text that follows a consistent and recognizable date format">![A Telerik and Kendo UI DateInput with a descriptive placeholder](images/components-dateinput-usage-placeholder-do.png "Use Telerik and Kendo UI DateInput components with descriptive placeholders.")</Do>
<Dont description="Avoid using placeholder text that is vague, ambiguous, or inconsistent as it may lead to confusion and incorrect date entries, hindering the user experience.">![A Telerik and Kendo UI DateInput with vague placeholder text](images/components-dateinput-usage-placeholder-dont.png "Don't use Telerik and Kendo UI DateInputs with vague placeholder text.")</Dont>
</DosDonts>


### Incremental Steps

The Incremental Steps feature of the DateInput component allows users to navigate through dates by using predefined steps. Depending on the specific context and user needs, the incremental steps can be triggered either by using the keyboard arrows or spin buttons.

<DosDonts>
<Do description="Be consistent when using DateInput components with the Incremental Steps feature.">![A Telerik and Kendo UI DateInput demonstrating consistent rendering](images/components-dateinput-usage-incremental-steps-do.png "Use the same rendering for the Telerik and Kendo UI DateInput components in your apps.")</Do>
<Dont description="Avoid mixing DateInput components with different rendering when taking advantage of the Incremental Steps feature.">![Incorrect mixture of Telerik and Kendo UI DateInputs using different rendering](images/components-dateinput-usage-incremental-steps-dont.png "Don't mix Telerik and Kendo UI DateInputs that use spin buttons with others that don't.")</Dont>
</DosDonts>