Parmi les nombreux points qu’il faut soigner lors de la création d’un formulaire, la gestion des erreurs est cruciale. Rien de plus énervant que de se faire renvoyer sur le formulaire avec des messages d’erreurs regroupés en haut de la page ou dans un pop-up. Encore pire si entre temps certains champs (souvent le mot de passe et sa confirmation) ont été effacés. Il y a certains formulaires qu’on valide 3 ou 4 fois avant de se voir autoriser à accéder à la page suivante !

Une gestion optimisée des erreurs, c’est

• Dans un premier temps, utiliser des libellés clairs et donner une explication ou un exemple si nécessaire, pour éviter que l’utilisateur fasse des erreurs.
• Afficher un message d’erreur clair, situé au niveau de l’erreur. Et le must : une vérification à la volée, c’est à dire lors du passage au champs suivant, et pas uniquement lors de la validation finale du formulaire. C’est de cela qu’il est question avec le plugin Ketchup.

Ce plugin qui utilise le jQuery permet d’afficher un message dans une bulle couleur Ketchup lorsque le contenu d’un champs n’est pas correct. Et bien entendu, la bulle disparait lorsque la saisie est corrigée.

Ketchup gère 17 validations, qui peuvent être combinées. Pour les autres, il faudra les ajouter soi-même. Et concernant l’apparence des messages d’erreur ou le message en lui même, il ne tient qu’à vous de les adapter.

Toutes les infos pour installer ce plugin sur le site du plugin Ketchup.