Overview
Inputmask is a javascript library that creates an input mask. Inputmask can run against vanilla javascript, jQuery, and jqlite.
For full documentation please check the plugin's documentation.
Usage
Inputmask's Javascript files are bundled in the global plugin bundles and globally included in all pages:
<script src="assets/plugins/global/plugins.bundle.js"></script>Initialization
-
Inputmask instances can be initialized via
new Inputmask()class as explained in the Documentation. -
Inputmask instances can be initialized via
data-inputmaskHTML attribute as explained in the Documentation.
Examples
Some examples of using Inputmaks with variouse options:
Custom date format:
mm/dd/yyyy
Phone number format:
(999) 999-9999
Phone number format with placeholder:
(999) 999-9999
Mask
9 , 99 or ... 9999999999
Numeric format
Currency format:
€ ___.__1.234,56
Custom format:
999.999.999.999
Custom format:
_@_
// Date
Inputmask({
"mask" : "99/99/9999"
}).mask("#kt_inputmask_1");
// Phone
Inputmask({
"mask" : "(999) 999-9999"
}).mask("#kt_inputmask_2");
// Placeholder
Inputmask({
"mask" : "(999) 999-9999",
"placeholder": "(999) 999-9999",
}).mask("#kt_inputmask_3");
// Repeating
Inputmask({
"mask": "9",
"repeat": 10,
"greedy": false
}).mask("#kt_inputmask_4");
// Right aligned
Inputmask("decimal", {
"rightAlignNumerics": false
}).mask("#kt_inputmask_5");
// Currency
Inputmask("€ 999.999.999,99", {
"numericInput": true
}).mask("#kt_inputmask_6");
// Ip address
Inputmask({
"mask": "999.999.999.999"
}).mask("#kt_inputmask_7");
// Email address
Inputmask({
mask: "*{1,20}[.*{1,20}][.*{1,20}][.*{1,20}]@*{1,20}[.*{2,6}][.*{1,2}]",
greedy: false,
onBeforePaste: function (pastedValue, opts) {
pastedValue = pastedValue.toLowerCase();
return pastedValue.replace("mailto:", "");
},
definitions: {
"*": {
validator: '[0-9A-Za-z!#$%&"*+/=?^_`{|}~\-]',
cardinality: 1,
casing: "lower"
}
}
}).mask("#kt_inputmask_8");
2024©
Keenthemes
