August 20, 2013 7:40 am

How to Mask an input box in jQuery

Today i have some requirement for masking on one of my project and i have used a masking lightweight library and i love it. So i have decided to write about it on PHPGang. Masking allows users to easily fix width of input boxes where you require input from user in a pacific format like dates, phone numbers etc.


[wpdm_file id=28]DEMO

Follow blow given instructions and implement masking in you website.

How to use it:

Include jQuery Library and jQuery Input Mask plugin.

<script src=""></script>
<script src="dist/jquery.inputmask.bundle.min.js"></script>

Define your masks in your input boxes usingĀ data-inputmask attribute.

<input data-inputmask="'alias': 'date'" />
<input data-inputmask="'mask': '99-9999999'" />

Call the plugin



Author Huzoor Bux

I am Huzoor Bux from Karachi (Pakistan). I have been working as a PHP Developer from last 5+ years, and its my passion to learn new things and implement them as a practice. Basically I am a PHP developer but now days exploring more in HTML5, CSS and jQuery libraries.

Tutorial Categories:

One response to “How to Mask an input box in jQuery”

  1. Lavish says:

    wow its awsome

Leave a Reply

Your email address will not be published. Required fields are marked *