---
path: components/maskedtextbox/usage
title: Usage
position: 2
seo_title: Guidelines for Using the MaskedTextBox Component
seo_description: Get the knack of the Telerik and Kendo UI MaskedTextBox 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 MaskedTextBox requires you to follow some basic principles when using the component.

### Tolerance

The usage of a MaskedTextBox is always contextual, that is why it is important to set proper requirements. Different types of inputs require different combinations of special symbols, numbers, and letters. For example, credit and debit cards have hyphens between every four digits. However, it is not necessary to make the users insert those extra symbols.

<DosDonts>
<Do description="Spare users the time and effort to insert extra symbols if possible.">![A Telerik and Kendo UI MaskedTextBox allowing the user to type in only the digits, and not the hyphens, of the required Credit card input.](images/components-maskedtextbox-usage-tolerance-do.png "Save users time and efforts by allowing them to focus on typing in the essential information in a Telerik and Kendo UI MaskedTextBox.")</Do>
<Dont description="Avoid making users spend extra time and effort to аdd symbols that may distract them from the main information.">![A Telerik and Kendo UI MaskedTextBox showing a hint for them to explicitly type in the hyphens between every four digits of their credit card number.](images/components-maskedtextbox-usage-tolerance-dont.png "Do not make users spend extra time and efforts when typing in the required data in a Telerik and Kendo UI MaskedTextBox.")</Dont>
</DosDonts>


### Text Label

Similarly to the NumericTextBox, the MaskedTextBox works with a predefined type of input and, therefore, requires you to clearly communicate its context. When included in a form, the MaskedTextBox is accompanied by a text label which clarifies its meaning and purpose. When integrated into complex components, for example, in the cells of a Grid, the MaskedTextBox does not require a label.

<DosDonts>
<Do description="Use a text label to clarify the type of the required input.">![A Telerik and Kendo UI MaskedTextBox with a Zip code label introducing the required user input.](images/components-maskedtextbox-usage-text-label-do.png "Use a Telerik and Kendo UI MaskedTextBox with a label which states what user input is required.")</Do>
<Dont description="Avoid skipping the text label unless the MaskedTextBox is part of a complex component having its context already set.">![A Telerik and Kendo UI MaskedTextBox with no label making it impossible to understand what type of information is required.](images/components-maskedtextbox-usage-text-label-dont.png "Do not render a Telerik and Kendo UI MaskedTextBox without a label to avoid misunderstanding and frustration on behalf of the user.")</Dont>
</DosDonts>


### Hint

If the required input type of the MaskedTextBox has some specific limitations, users must be aware of them so that they are able to meet the validation requirements.

<DosDonts>
<Do description="Clarify the restrictions for the MaskedTextBox input to help users meet its validation requirements.">![A Telerik and Kendo UI MaskedTextBox with a hint sentence in red stating that the typed email address is not valid.](images/components-maskedtextbox-usage-hint-do.png "Use a Telerik and Kendo UI MaskedTextBox with a hint that indicates what the validation rule is and what type of input is required from the user.")</Do>
<Dont description="Avoid leaving users at a loss as of why their input doesn't pass the validation requirements.">![A Telerik and Kendo UI MaskedTextBox not accepting the user email address input or showing what the required input type is.](images/components-maskedtextbox-usage-hint-dont.png "Do not use a Telerik and Kendo UI MaskedTextBox which lacks a validation hint as of what the requirements for the user input are.")</Dont>
</DosDonts>