Validation

The MaskedTextBox provides a set of predefined mask rules and enables you to modify them.

The default MaskedTextBox mask is an empty string which allows for any type of user input. To restrict user input, define a mask value.

Predefined Masks

The MaskedTextBox supports the following predefined mask rules:

  • 0—Digit. Accepts any digit between 0 and 9.
  • 9—Digit or space. Accepts any digit between 0 and 9 or space.
  • #—Digit or space. Identical to Rule 9. In addition, allows the + (plus) and - (minus) signs.
  • L—Letter. Restricts the input to a-z and A-Z letters. This rule is equivalent to [a-zA-Z] in regular expressions.
  • ?—Letter or space. Restricts the input to letters a-z and A-Z. This rule is equivalent to [a-zA-Z]|\s in regular expressions.
  • &—Character. Accepts any character except a space. The rule is equivalent to \S in regular expressions.
  • C—Character or space. Accepts any character. The rule is equivalent to . in regular expressions.
  • A—Alphanumeric. Accepts letters and digits only.
  • a—Alphanumeric or space. Accepts only letters, digits, and space.

To escape any of the masks, use the \ character. The escaped rules are transformed into literals.

Literals

Based on the current culture, the following mask literals are globalized:

  • .—Decimal placeholder. The decimal separator is set according to the current culture used by Kendo UI.
  • ,—Thousands placeholder. The display character is set according to the current culture used by Kendo UI.
  • $—Currency symbol. The display character is set according to the current culture used by Kendo UI.

To escape any of the literals, use the \ character.

Custom Masks

The MaskedTextBox enables you to define custom mask rules during initialization. To customize a mask rule, define it in the rules option. The widget supports rules that are defined as a regular expression or a function.

To escape any of the predefined rules, use the rules option.

<script>
  $(document).ready(function(){
    $("#maskedtextbox").kendoMaskedTextBox({
      mask: "~^",
      rules: {
        "~": /[+-]/,
        "^": function (char) {
          return char === "^"; //allow ony "^" symbol
        }
      }
    });
  });
</script>

See Also

In this article
Not finding the help you need? Improve this article