JavaScript MaskedTextBox - Fast And Easy To Use

In almost every developer's practice have occurred cases when a rapid, efficient and easy solution is needed for a restricted textbox which obeys input to predefined or custom defined rules. Instead of wasting time wondering how to verify different zip codes, telephone numbers, elaborate identification numbers etc. it is easy using a maskedtextbox and with a small effort to achieve great results. ShieldUI Lite gives you the ease to comfortably solve such business tasks with ease. Just download the script files, build them, include the jquery library in your page and
you will have the working solution.

    <link id="themecss" rel="stylesheet" type="text/css" href="/css/light/all.min.css" />
    <script type="text/javascript" src="/js/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="/js/shieldui-all.min.js"></script>

Place the input control on your page:

    <input id="zipbox" width="200" />

Now let us assume we want to enter a zip code of five digits:

<script type="text/javascript">
	jQuery(function ($) {
		$("#zipbox").shieldMaskedTextBox({
			enabled: true,
			mask: "00000", // 0 - allow digits between 0-9
			value: "98104"
			promptChar: '_'
		});
	});
</script>

So far, so good. Now let us assume we want to place a field for valid telephone numbers.

	<input id="phonebox" width="200" />

After putting the input box, we add the script in no time and have it all working.

<script type="text/javascript">
	jQuery(function ($) {
		$("#phonebox").shieldMaskedTextBox({
			enabled: true,
			mask: "+0-000-000-0000",
			rules: {
				'+': function(source) { return source === '+'; }
			},
			value: "+1-877-785-5942",
			promptChar: '_'
		});
	});
</script>

For a live demo, you can check ShieldUI's MaskedTextBox live demos.