VALIDATIONS À IMPLEMENTER
1- Le pseudo doit faire au moins 3 caractères et au plus 16 caractères (e.r.: ^.{3,16}$).
2- Le pseudo doit être composé exclusivement de lettres ou de chiffres, mais le premier
caractère doit être une lettre (e.r.: ^[a-zA-Z][a-zA-Z0-9]*$).
3- Le mot de passe doit avoir entre 8 et 16 caractères (e.r.: ^.{8,16}$) et contenir au minimum
une lettre majuscule (e.r.: [A-Z]), un chiffre (e.r.: \d) et un caractère de ponctuation
(e.r.: ['";:,.\/?\\-]).
4- Le mot de passe et le mot de passe de confirmation doivent être identiques.
5- La soumission du formulaire doit être impossible tant qu'il y a une erreur.
6- Les erreurs qui ne concernent qu'un seul champ doivent être détectées et affichées
directement lors de la modification de la valeur de ce champ. Par contre, l'erreur qui impose
que les deux mots de passe soient identiques ne doit être vérifiée et affichée qu'une fois que
l'utilisateur a modifié les deux champs ou tenté de soumettre le formulaire.
PISTES POUR IMPLÉMENTATION
1- .
Regroupez les règles de validation du pseudo dans une fonction checkPseudo() qui
retourne un booléen
Associer la fonction à l’évènement onchange du champ pseudo
2- .
Regroupez les règles de validation du mot de passe dans une
fonction checkPassword() qui retourne un booléen
Associer la fonction à l'événement onchange du champ password
3- .
Regroupez les règles de validation du mot de passe de confirmation dans une
fonction checkPasswords() qui retourne un booléen
Associer la fonction à l'événement onchange du champ passwordConfirm.
4- .
Créez une quatrième fonction checkAll() qui retourne un booléen La fonction doit
déclencher toutes les validations en faisant appel aux fonctions précédentes et
retourner false s'il y a des erreurs.
Associer la fonction à l'événement onsubmit de la <form>.
5- .
Chaque erreur détectée par l'une de ces fonctions doit générer l'affichage d'un
message d'erreur à droite du champ concerné. Pour cela, vous devez
dynamiquement (càd à partir de votre code JS) ajouter votre message d'erreur dans
la cellule (<td class="errors>) correspondante de la <table>. Celle-ci est vide au
départ, mais vous pouvez y mettre du contenu en utilisant la
propriété innerHTML de l'élément DOM associé. Tenez compte du fait qu'une même
cellule pourrait contenir plusieurs messages d'erreur.
errPseudo
errPassword
errConfirmPassword