This time I will share jQuery Plugin and tutorial about Mask & Format User Input In Text Fields – jQuery Samask, hope it will help you in programming stack.
Samask is a lightweight and easy-to-use jQuery input mask plugin for arbitrary input fields within the document.
It can be used to mask/validate/format/restrict user input in text fields to a specific pattern such as telephone number, date, time, duration, currency, IP address, and much more.
How to use it:
1. Include the jquery.samask-masker.js script after jQuery library.
2 |
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" |
3 |
crossorigin="anonymous"></script> |
4 |
<script src="jquery.samask-masker.js"></script> |
2. Apply the samask plugin to the input field and set the format that entered data must conform to.
1 |
<input class="demo" type="type"> |
1 |
$('.demo').samask("(000)000-0000"); |
2 |
$('.demo').samask("00:00:00"); |
3 |
$('.demo').samask("00/00/0000"); |
4 |
$('.demo').samask("00/00/0000 00:00:00"); |
5 |
$('.demo').samask("000.000.000.000"); |
6 |
$('.demo').samask("%00"); |
7 |
$('.demo').samask("SSS-000"); |
3. You can also specify the format via data attribute as this:
1 |
<input class="demo" type="type" data-samask="(000)000-0000"> |
This awesome jQuery plugin is developed by roguearch. For more Advanced Usages, please check the demo page or visit the official website.
