Vérifier plusieurs champs avec une fonction
Fermé
AlexandraBr
Messages postés
13
Date d'inscription
mercredi 30 juillet 2014
Statut
Membre
Dernière intervention
25 mars 2015
-
30 juil. 2014 à 14:38
AlexandraBr Messages postés 13 Date d'inscription mercredi 30 juillet 2014 Statut Membre Dernière intervention 25 mars 2015 - 31 juil. 2014 à 15:23
AlexandraBr Messages postés 13 Date d'inscription mercredi 30 juillet 2014 Statut Membre Dernière intervention 25 mars 2015 - 31 juil. 2014 à 15:23
A voir également:
- Vérifier plusieurs champs avec une fonction
- Verifier un lien - Guide
- Fonction si et - Guide
- Verifier compatibilite windows 11 - Guide
- Vérifier si mot de passe piraté - Guide
- Fonction somme excel - Guide
4 réponses
Salut,
déjà une petite recherche devrais vous fournir plus d'informations que vous n'en avez besoin:
https://www.google.fr/search?q=verification+de+formulaire+en+javascript
Quelques explications quand même.
Si on regardes où est utilisé votre fonction:
<input type="text" name="hache_demi" id="textfield" size="5" onblur="verifierNombre();" />
Au passage il y a une erreur: une id doit être unique et vous avez tout vos champs qui ont id="textfield".
Il faut utiliser soit name soit id, les 2 à la fois servent rarement.
La différence entre les 2 est que l'id(pour identifiant) est unique et que pour un name(nom de champ) on peut l'utiliser plusieurs fois. Ici un id conviendrait mieux et devrait avoir la valeur du name comme ceci:
<input type="text" id="hache_demi" size="5">
on s'aperçoit que la fonction est déclenchée lors de(l'événement) onblur(autrement dit lorsque l'on quitte le champ concerné).
Hors pour vérifier plusieurs champs cela ne peut pas convenir.
Le mieux est de vérifier tout les champs qui ont besoin de l'être lors de la validation du formulaire.
Un formulaire est envoyé par un bouton d'envoi(submit).
C'est lors de cette action qu'il faut utiliser la fonction et valider ou non l'envoi de celui ci.
Revenons à votre fonction:
Votre fonction récupère la valeur du champ nommé "hache_demi" dans la variable str.
var str = document.formulaire_commande.hache_demi.value;
Puis on regarde si str n'est pas un nombre avec la fonction isNaN().
L'instruction 'if'(si) est une instruction conditionnelle et permet de faire 'bifurquer' selon que str n'est pas un nombre(on affiche un message d'erreur) ou est un nombre(tout est ok on passe à la suite).
Pour vérifier plusieurs champs il faut répéter ceci pour autant de champs qu'il est nécessaire de vérifier, la moindre erreur provoquant l'apparition d'un message d'alerte(et bloquant le programme).
Pour éviter ce 'blocage' et indiquer à la fin toutes les vérifications on peut utiliser une autre variable. Cette variable va contenir toutes les erreurs du formulaire(ou aucune s'il n'y a pas d'erreur).
function verif_formulaire(){
// ici on initialise la variable verification avec un texte vide.
var verification="";
//verification du premier champ hache_demi
var str = document.formulaire_commande.hache_demi.value;
if (isNaN(str)) {
verification+="haché demi doit être un nombre";
// si erreur on la note dans la var verification
}
//puis on verifie pour le second champ
var str = document.formulaire_commande.hache_75.value;
if (isNaN(str)) {
verification+="haché 75 doit être un nombre";
/* on peut remarque que les symboles "+=" permettent de rajouter à la suite du texte déjà enregistré(ou pas) dans var verification le nouveau texte. Cette opération s'appele concaténer
*/
}
//Et ainsi de suite pour chaque champ à vérifier
//ici on teste la valeur de verification
if(verification==""){//si verification est resté vide)
//on envoit le formulaire il n'y a aucune erreur
document.formulaire_commande.submit();
}else{//sinon verification n'est pas vide
/* on n'envoie pas le formulaire et on affiche les erreurs enregistrée dans verification*/
alert(verification);
}
}
Voilà pour le principe, je n'ai pas testé et il peut y avoir quelques corrections mineures à faire.
Inspirez vous des exemples sur le web comme celui ci très complet et avec (toutes) explications détaillées:
http://openweb.eu.org/articles/validation_formulaire
déjà une petite recherche devrais vous fournir plus d'informations que vous n'en avez besoin:
https://www.google.fr/search?q=verification+de+formulaire+en+javascript
Quelques explications quand même.
Si on regardes où est utilisé votre fonction:
<input type="text" name="hache_demi" id="textfield" size="5" onblur="verifierNombre();" />
Au passage il y a une erreur: une id doit être unique et vous avez tout vos champs qui ont id="textfield".
Il faut utiliser soit name soit id, les 2 à la fois servent rarement.
La différence entre les 2 est que l'id(pour identifiant) est unique et que pour un name(nom de champ) on peut l'utiliser plusieurs fois. Ici un id conviendrait mieux et devrait avoir la valeur du name comme ceci:
<input type="text" id="hache_demi" size="5">
on s'aperçoit que la fonction est déclenchée lors de(l'événement) onblur(autrement dit lorsque l'on quitte le champ concerné).
Hors pour vérifier plusieurs champs cela ne peut pas convenir.
Le mieux est de vérifier tout les champs qui ont besoin de l'être lors de la validation du formulaire.
Un formulaire est envoyé par un bouton d'envoi(submit).
C'est lors de cette action qu'il faut utiliser la fonction et valider ou non l'envoi de celui ci.
Revenons à votre fonction:
Votre fonction récupère la valeur du champ nommé "hache_demi" dans la variable str.
var str = document.formulaire_commande.hache_demi.value;
Puis on regarde si str n'est pas un nombre avec la fonction isNaN().
L'instruction 'if'(si) est une instruction conditionnelle et permet de faire 'bifurquer' selon que str n'est pas un nombre(on affiche un message d'erreur) ou est un nombre(tout est ok on passe à la suite).
Pour vérifier plusieurs champs il faut répéter ceci pour autant de champs qu'il est nécessaire de vérifier, la moindre erreur provoquant l'apparition d'un message d'alerte(et bloquant le programme).
Pour éviter ce 'blocage' et indiquer à la fin toutes les vérifications on peut utiliser une autre variable. Cette variable va contenir toutes les erreurs du formulaire(ou aucune s'il n'y a pas d'erreur).
function verif_formulaire(){
// ici on initialise la variable verification avec un texte vide.
var verification="";
//verification du premier champ hache_demi
var str = document.formulaire_commande.hache_demi.value;
if (isNaN(str)) {
verification+="haché demi doit être un nombre";
// si erreur on la note dans la var verification
}
//puis on verifie pour le second champ
var str = document.formulaire_commande.hache_75.value;
if (isNaN(str)) {
verification+="haché 75 doit être un nombre";
/* on peut remarque que les symboles "+=" permettent de rajouter à la suite du texte déjà enregistré(ou pas) dans var verification le nouveau texte. Cette opération s'appele concaténer
*/
}
//Et ainsi de suite pour chaque champ à vérifier
//ici on teste la valeur de verification
if(verification==""){//si verification est resté vide)
//on envoit le formulaire il n'y a aucune erreur
document.formulaire_commande.submit();
}else{//sinon verification n'est pas vide
/* on n'envoie pas le formulaire et on affiche les erreurs enregistrée dans verification*/
alert(verification);
}
}
Voilà pour le principe, je n'ai pas testé et il peut y avoir quelques corrections mineures à faire.
Inspirez vous des exemples sur le web comme celui ci très complet et avec (toutes) explications détaillées:
http://openweb.eu.org/articles/validation_formulaire
AlexandraBr
Messages postés
13
Date d'inscription
mercredi 30 juillet 2014
Statut
Membre
Dernière intervention
25 mars 2015
31 juil. 2014 à 13:39
31 juil. 2014 à 13:39
Bonjour,
J'avais déjà fait une recherche sur google et avait trouver certaine chose....
Merci pour ton explication, c'est très clair :)
Juste une chose, j'ai déjà une autre fonction qui teste les coordonnées de contact lors de l'envoie du formulaire.
J'ai essayer qu'il teste les 2 fonctions en même temps mais je n'ai pas trouvé, il ne me testait plus rien, c'est pour cela que j'avais mis un Onblur.... mais qui n'est pas la bonne solution comme je vois....
Je vais tester tout ça avec tes explications...
Merci encore pour ton aide
J'avais déjà fait une recherche sur google et avait trouver certaine chose....
Merci pour ton explication, c'est très clair :)
Juste une chose, j'ai déjà une autre fonction qui teste les coordonnées de contact lors de l'envoie du formulaire.
J'ai essayer qu'il teste les 2 fonctions en même temps mais je n'ai pas trouvé, il ne me testait plus rien, c'est pour cela que j'avais mis un Onblur.... mais qui n'est pas la bonne solution comme je vois....
Je vais tester tout ça avec tes explications...
Merci encore pour ton aide
AlexandraBr
Messages postés
13
Date d'inscription
mercredi 30 juillet 2014
Statut
Membre
Dernière intervention
25 mars 2015
31 juil. 2014 à 14:14
31 juil. 2014 à 14:14
Re bonjour,
J'ai testé, ça marche sauf que j'ai un soucis...
Il me mets bien le message d'erreur mais m'envoyer quand même le formulaire sans laissé l'occasion de modifié les donnée....
Je vais chercher pourquoi ça fait ça, j'ai appelé la fonction sur le bouton submit mais je suppose que j'ai mal fait quelque chose...
J'ai testé, ça marche sauf que j'ai un soucis...
Il me mets bien le message d'erreur mais m'envoyer quand même le formulaire sans laissé l'occasion de modifié les donnée....
Je vais chercher pourquoi ça fait ça, j'ai appelé la fonction sur le bouton submit mais je suppose que j'ai mal fait quelque chose...
AlexandraBr
Messages postés
13
Date d'inscription
mercredi 30 juillet 2014
Statut
Membre
Dernière intervention
25 mars 2015
31 juil. 2014 à 15:23
31 juil. 2014 à 15:23
J'ai trouvé pour testé 2 paramètre dans ma fonction...
Pour la vérification des chiffres avec isNaN(str), est-il possible de vérifier tout les champs et de mettre une message d'erreur uniquement ?
Ne serais ce pas plus simple et plus clair ?
Merci de me donner votre avis
Pour la vérification des chiffres avec isNaN(str), est-il possible de vérifier tout les champs et de mettre une message d'erreur uniquement ?
Ne serais ce pas plus simple et plus clair ?
Merci de me donner votre avis
