Examples
RegExp (Russian postal code) /^[1-6]\d{0,5}$/
Pattern (Phone) +{7}(000)000-00-00
Number in range [-10000, 10000]
Date 'dd.mm.yyyy' in range [01.01.1990, 01.01.2020]
On-the-fly select phone or email
Mask in mask currency input
<!-- RegExp (Russian postal code) -->
<input id="regexp-mask" type="text" class="form-control">
<!-- Pattern (Phone) -->
<input id="phone-mask" type="text" class="form-control">
<!-- Number in range -->
<input id="number-mask" type="text" class="form-control">
<!-- Date -->
<input id="date-mask" type="text" class="form-control">
<!-- On-the-fly select -->
<input id="dynamic-mask" type="text" class="form-control">
<!-- Mask in mask -->
<input id="currency-mask" type="text" class="form-control">
<!-- Vendor : Imask -->
<script src="../assets/vendors/imask/dist/imask.min.js"></script>
<script>
/* RegExp (Russian postal code) */
IMask( document.getElementById('regexp-mask'), {
mask: /^[1-6]\d{0,5}$/
});
/* Pattern (Phone) */
IMask( document.getElementById('phone-mask'), {
mask: '+{7}(000)000-00-00'
});
/* Number in range [-10000, 10000] */
IMask( document.getElementById('number-mask'), {
mask: Number,
min: -10000,
max: 10000,
thousandsSeparator: ' '
});
/* Date 'dd.mm.yyyy' in range [01.01.1990, 01.01.2020] */
IMask( document.getElementById('date-mask'), {
mask: Date,
min: new Date(1990, 0, 1),
max: new Date(2020, 0, 1),
lazy: false
});
/* On-the-fly select */
IMask( document.getElementById('dynamic-mask'), {
mask: [{
mask: '+{7}(000)000-00-00'
},{
mask: /^\S*@?\S*$/
}]
});
/* Mask in mask */
IMask( document.getElementById('currency-mask'), {
mask: '$num',
blocks: {
num: {
// nested masks are available!
mask: Number,
thousandsSeparator: ' '
}
}
});
</script>