All Components

Customized Mask Rules

The MaskedTextBox enables you to define custom mask rules during its initialization.

To customize a mask rule, define it in the rules option. The component allows you to define mask rules as regular expressions or functions.

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

<div id="vueapp" class="vue-app">
    <kendo-maskedtextbox :rules=rules mask="~^">
    </kendo-maskedtextbox>
</div>
Vue.use(InputsInstaller);

new Vue({
    el: "#vueapp",
    data () {
        return {
            rules: {
                "~": /[+-]/,
                "^": function (char) {
                    return char === "^"; //allow only "^" symbol
                }
            }
        }
    }
})
In this article