Kendo UI for jQuery MaskedTextBox Overview
The MaskedTextBox enables a controlled text input that is based on a specific format.
The widget enables you to define its value and mask value, and set custom mask rules, prompt characters, and culture names. Each mask can contain mask rules and mask literals. The mask literals are automatically entered for the user and cannot be removed. You can also use the MaskedTextBox predefined rules which specify the required or optional digit, letter, or character input.
The MaskedTextBox is part of Kendo UI for jQuery, 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.
Initializing the MaskedTextBox
The following example demonstrates how to initialize the MaskedTextBox. When initialized, the MaskedTextBox decorates the <input> element with a k-textbox CSS class.
<input id="maskedtextbox" />
<script>
$(document).ready(function(){
$("#maskedtextbox").kendoMaskedTextBox({
mask: "000000"
});
});
</script>
Referencing Existing Instances
To get a reference to an existing MaskedTextBox instance:
- Use the
jQuery.data()method. -
Once a reference is established, use the MaskedTextBox API to control its behavior:
var maskedtextbox = $("#textbox").data("kendoMaskedTextBox");
Functionality and Features
The MaskedTextBox supports the implementation of mask rules to validate its input value.
To learn more about the appearance, anatomy, and accessibility of the MaskedTextBox, visit the Progress Design System documentation—an information portal offering rich component usage guidelines, descriptions of the available style variables, and globalization support details.
Known Limitations
To restrict the typed value, the MaskedTextBox "listens" to input events such as keydown and keypress.
- In some mobile browsers, mostly Android or the Windows Mobile OS built-in browsers, those events do not trigger at all. As a result, the normal behavior of the MaskedTextBox is prevented because they are fundamental for the typing restriction.
- Recent tests show that the MaskedTextBox works in the latest iOS OS version.
You cannot work around these issues, because no other reliable way to detect typing in mobile browsers exist—virtual keyboard does not raise any other specific events.