Validation de formulaire

Salut à tous,

Et oui encore un sujet sur la validation de formulaire en javascript. Mais cette fois, je m'adresse à vous pour obtenir vos conseils et/ou avis.

Lorsque je valide mon formulaire et qu'un champ n'est pas rempli ou bien ne répond pas au caractéristique du champ (par exemple une adresse mail du type @.fr) je souhaite modifier l'apparence du champ input. Pour cela, plusieurs méthodes se présentent.
Tout d'abord, je peut utilisé l'attribut style de javascript (par exemple : document.getElementById('nom').style.borderColor = 'red'). L'autre solution est d'attribut une nouvelle classe au champ grâce à la fonction setAttribute.

Je voudrais donc savoir quelle méthode vous me conseilleriez sachant que je voudrais modifier l'apparence de la bordure ainsi que l'apparence du background du champ non valide.
Autre question, dans le cas de l'utilisation de la fonction setAttribute, existe-t-il une fonction qui permet de supprimer un attribut d'un element HTML. Je demande cela, car dans le cas où l'utilisateur corrige le champ il faut alors afficher le champ avec le style d'origine.

Merci d'avance pour vos réponse et votre aide.

Salut,

Tu peux faire autant l'une que l'autre. Tout dépend de ce que tu souhaites. Si tu veux laisser les styles css uniquement dans la feuille css, préfère setAttribute. Si tu veux minimiser le nombre de classes, préfère style. A toi de choisir.

Pour supprimer un attribut, tu as removeAttribute.

Salut,

Et pourquoi ne pas faire uniquement via PHP (et CSS) ?

Alain

Pour la rapidité d'éxécution m'est avis. C'est tout l'intérêt de l'utilisation du javascript dans les formulaires. Le fait d'agir en local permet de minimiser les échanges avec le serveur et offre un confort non négligeable à l'utilisateur.

Celà dit, il est préférable de doubler cette méthode par une en php, oui, si l'on considère que ce changement de style doit fonctionner avec ou sans javascript. Cà ne me semble pas indispensable à la différence de la vérification du champ en elle-même.
Modifié par koala64 (12 Feb 2006 - 09:43)

Je ne suis vraiment pas convaincu... J'utilise des formulaires uniquement en PHP (qui indiquent aussi les champs mal remplis en changeant leur apparence, comme souhaite ymhotepa) et quand je les teste, j'ai une impression d'instantanéité. Il y a sûrement une différence, mais je ne suis pas sûr qu'elle soit vraiment sensible pour l'internaute.
Modifié par Alan (12 Feb 2006 - 10:40)

Tout dépend du nombre d'erreurs, de ta connexion et du nombre d'utilisateurs qui effectuent la même tache à l'instant t.

La différence se fait surtout ressentir dès lors que tu augmentes le nombre de champs. En php, tu effectues un échange avec le serveur à chaque erreur... Pour peu que l'utilisateur en est fait pas mal, la différence devient nettement visible. Si tu fais un site "à succès", une surcouche de javascript pour la vérification te permet d'être plus réactif quand bien même 1000 visiteurs ( faut pas rêver! ) effectuent cette tache au même moment. Ce n'est pas le cas si tu restes uniquement en php, ton serveur explose. Ce langage te permet de fournir des informations nettoyées à la soumission du formulaire et préserve ta bande passante. J'ai beau disposer du haut débit, personnellement, je le ressens encore, même pour de petits formulaires.

Aussi, quelqu'un qui ne dispose que d'une petite connexion va, à coup sûr, en pâtir alors qu'il pourrait lui aussi disposer d'un traitement "instantanné".

On est bien d'accord sur le fait que le javascript reste un plus mais lorsqu'il comporte des avantages, autant s'en servir.

Merci koala pour ces précisions et désolé ymhotepa d'avoir fait dériver la discussion vers un autre sujet.

A+

Alan a écrit :

Merci koala pour ces précisions et désolé ymhotepa d'avoir fait dériver la discussion vers un autre sujet.

Y a pas de problème, au contraire tu as eut raison. C'est vrai que je ne pourrais faire les tests qu'en php, mais comme le dit koala, cela permet de n'envoyer que les bonnes donnéees au serveur et ainsi de réduire les acces au serveur.

koala64 a écrit :

Celà dit, il est préférable de doubler cette méthode par une en php...

C'est ce que je fait toujours. J'utilise une couche javascript et une couche PHP au cas ou l'utilisateur à desactiver javascript.

koala64 a écrit :

... oui, si l'on considère que ce changement de style doit fonctionner avec ou sans javascript. Cà ne me semble pas indispensable à la différence de la vérification du champ en elle-même.

Je n'ai pas très bien compris ce que tu voulais dire ici. Est ce que selon toi, il n'est pas important de signaler ( en changeant le style du champ) à l'utilisateur les champs erronés.

Alan a écrit :

... et quand je les teste, j'ai une impression d'instantanéité.

Du fait de l'accès au serveur, tu as toujours un temps d'attente (plus ou moins important) alors que le javascript agissant directement sur le client est quant à lui instantané. Mais bon, je suis d'accord que l'utilisateur peut attendre quelques secondes pour voir si tout est bon.

Juste une dernière question à Alan. Comment fait tu en PHP pour changer le style des champ erronés. Tu attributs une nouvelle classe au champ du genre :

<?php
 $res = '<input type="text" name="nom" id="nom"';
 if ($erreur)
   $res .= 'class="error"';
  $res .= 'value="'.$nom.'" />';
?>

Ou bien utilises tu une autre méthode. Cela m'intersesse.

Un grand merci à vous deux pour vos conseil et pour cette discussion.
Modifié par ymhotepa (12 Feb 2006 - 15:58)

J'utilise la même technique que sur cette page :
http://ppan.net/webdev/formulaire-sans-javascript-avec-piece-jointe.php
testable ici : http://ppan.net/webdev/contact.php?test=1

(je me suis d'ailleurs basé sur ce forumlaire de contact pour faire réaliser le mien)

Merci beaucoup pour ce lien, je vais aller y jeter un coup d'oeil.

koala64 a écrit :

... oui, si l'on considère que ce changement de style doit fonctionner avec ou sans javascript. Cà ne me semble pas indispensable à la différence de la vérification du champ en elle-même.

ymhotepa a écrit :

Je n'ai pas très bien compris ce que tu voulais dire ici. Est ce que selon toi, il n'est pas important de signaler ( en changeant le style du champ) à l'utilisateur les champs erronés.

En fait, je trouve plus judicieux d'ajouter un texte informant de l'erreur survenue plutôt que de se contenter d'un simple style ajouté uniquement parce que celui qui visualise la page sans css n'aura pas de mise en évidence du problème (mis à part le focus). Dans ce cas, çà ne devrait donc rester qu'un plus qui peut se gérer en js puisque l'erreur sera repérée en toute circonstance. Au même titre que le javascript, je pense qu'il vaut mieux laisser le css en option.