Plugin JQuery – Un contrôleur de formulaire

Le plugin JQuery Validation Engine est plus qu’un plugin, c’est un contrôleur de formulaire abouti : Contrôle de champs obligatoire, d’intégrité de saisie… Tout y passe. Explications.

Il suffit de le télécharger et d’en inclure les fichiers javascript et css, le tout avec  jquery. En somme :

<head>
<link rel="stylesheet" href="css/validationEngine.jquery.css" type="text/css" media="screen" title="no title" />
<link rel="stylesheet" href="css/template.css" type="text/css" media="screen" title="no title" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="js/jquery.js" type="text/javascript"></script>
<script src="js/jquery.validationEngine-fr.js" type="text/javascript"></script>
<script src="js/jquery.validationEngine.js" type="text/javascript"></script>
</head>

Le reste se gère par les classes. Je m’explique… si vous mettez ceci dans votre page

<input class="validate[required,custom[onlyLetter],length[0,100]] text-input" type="text" />

Cela signifie que vous contraignez le champ texte à être obligatoire, et à ne contenir que des lettres avec une longueur de 100 caractères maxi. Si l’internaute déroge à cette règle, un message apparaît en fondu.

Ou encore, vous souhaitez inclure trois cases à cocher, mais obliger à en cocher au moins deux :

<input class="validate[minCheckbox[2]] checkbox" type="checkbox" name="group1" value="5"/>
<input class="validate[minCheckbox[2]] checkbox" type="checkbox" name="group1" value="3"/>
<input class="validate[minCheckbox[2]] checkbox" type="checkbox" name="group1" value="9"/>

>>> Docs, démos et téléchargements

1 commentaire

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *