Field formating is a feature that all client application must have.
Specially with web application it´s not “cool” to create masks and some interface features, at least for back end developers.
So, that’s a good tool named: jQuery, it’s a javascript library, easy to use and very simple.
This sample, was to create a mask for Brazilian fields, like Zip code, Phone and Date.
1 – Downloads
jQuery lib: http://jquery.com/
MaskedInput lib: http://digitalbush.com/projects/masked-input-plugin
2 – HTML code:
<html>
<head>
<script type=”text/javascript” src=”jquery-1.2.3.js”></script>
<script type=”text/javascript” src=”jquery.maskedinput-1.1.2.js”></script>
<body>
<script type=”text/javascript”>
$.noConflict( );
jQuery(function($){
$.mask.addPlaceholder(“~”,”[+-]“);
$(“#fieldDate”).mask(“99/99/9999″);
$(“#fieldBrZip”).mask(“99999-999″);
$(“#fieldPhone1″).mask(“(99) 9999-9999″);
});
</script>
Date: <input id=”fieldDate” type=”text” /> 99/99/9999<br>
BR. Zip: <input id=”fieldBrZip” type=”text” /> 99999-999<br>
Phone: <input id=”fieldPhone1″ type=”text” /> (99)9999-9999<br>
</body>
</html>
