Plugin jQuery de paramétrage des champs de saisie de formulaire.

Comment ça marche?

DEMO

TELECHARGEMENT  

Masked Input Plugin

Dans le code:

First, include the jQuery and masked input javascript files.

<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.maskedinput.js" type="text/javascript"></script>

Next, call the mask function for those items you wish to have masked.

jQuery(function($){
   $("#date").mask("99/99/9999");
   $("#phone").mask("(999) 999-9999");
   $("#tin").mask("99-9999999");
   $("#ssn").mask("999-99-9999");
});

Optionally, if you are not satisfied with the underscore (‘_’) character as a placeholder, you may pass an optional argument to the maskedinput method.

jQuery(function($){
   $("#product").mask("99/99/9999",{placeholder:" "});
});

Optionally, if you would like to execute a function once the mask has been completed, you can specify that function as an optional argument to the maskedinput method.

jQuery(function($){
   $("#product").mask("99/99/9999",{completed:function(){alert("You typed the following: "+this.val());}});
});

You can now supply your own mask definitions.

jQuery(function($){
   $.mask.definitions['~']='[+-]';
   $("#eyescript").mask("~9.99 ~9.99 999");
});

You can have part of your mask be optional. Anything listed after ‘?’ within the mask is considered optional user input. The common example for this is phone number + optional extension.

jQuery(function($){
   $("#phone").mask("(999) 999-9999? x99999");
});
Publicités

Vérifications de formulaires… Alléluia HTML5!

Avant l’arrivée d’html5 la vérification de formulaire côté client s’avérée… pénible.

Certains plugIns de la librairie jQuery aidaient déjà pas mal tel que montré ici:

 

 

Et puis html5 arriva…

 

 

A lire aussi:

Merci à grafikart.fr pour la qualité de leurs tutoriels.