Valider formulaire avec deux "document.forms"
Le
Viwiv
Bonjour,
Je souhaiterai valider un formulaire en JavaScript.
J'ai trouvé sur l'excellent
http://www.openweb.eu.org/articles/...ormulaire/
un article à ce sujet.
Son auteur propose d'utiliser l'instruction suivante, que je compte
utiliser comme fichier externe pour rester conformer avec l'Xhtml sans
me casser la tête :
function valider(){
frm=document.forms['bonjour'];
if(frm.elements['prenom'].value != "") {
return true;
}
else {
alert("Saisissez le prénom");
return false;
}
}
'bonjour" est le nom de mon formulaire, 'prenom' est le champ à
tester.
Jusque là, l'instruction fonctionne.
En revanche, je m'interroge sur la façon de procéder pour ajouter un
deuxième contrôle du même type, par exemple pour un champ 'nom'.
J'ai essayé d'imbriquer des if et des elseif, mais ça ne fonctionne
pas
Si je créée deux fichiers javaScript, l'un pour le prénom, l'autre
pour le nom, cette option fonctionne, mais je ne la trouve guère
élégante
Aussi souhaiterai-je avoir vos avis et vos conseils pour résoudre mon
problème.
Soyez-en remerciés.
Cordialement,
Vincent
Je souhaiterai valider un formulaire en JavaScript.
J'ai trouvé sur l'excellent
http://www.openweb.eu.org/articles/...ormulaire/
un article à ce sujet.
Son auteur propose d'utiliser l'instruction suivante, que je compte
utiliser comme fichier externe pour rester conformer avec l'Xhtml sans
me casser la tête :
function valider(){
frm=document.forms['bonjour'];
if(frm.elements['prenom'].value != "") {
return true;
}
else {
alert("Saisissez le prénom");
return false;
}
}
'bonjour" est le nom de mon formulaire, 'prenom' est le champ à
tester.
Jusque là, l'instruction fonctionne.
En revanche, je m'interroge sur la façon de procéder pour ajouter un
deuxième contrôle du même type, par exemple pour un champ 'nom'.
J'ai essayé d'imbriquer des if et des elseif, mais ça ne fonctionne
pas
Si je créée deux fichiers javaScript, l'un pour le prénom, l'autre
pour le nom, cette option fonctionne, mais je ne la trouve guère
élégante
Aussi souhaiterai-je avoir vos avis et vos conseils pour résoudre mon
problème.
Soyez-en remerciés.
Cordialement,
Vincent
Poser une question
ha! oui ! çà a l'air d'être une fonction donnée au onsubmit du form
Super
mais tu n'as pas l'air de comprendre comment çà fonctionne ?
cette fonction de vérification, quand elle a fini son job,
et si tout est ok doit renvoyer 'vrai' ( return true; )
dès qu'elle rencontre une anomalie hop !
- gueule gueule gueule ! kesaco c'bazzar ! ( alert('kesaco ?'); )
- hop ! terminé ! envoyer 'faux' ( return false; )
c'est tout simple ( hu ... ? enfin qd on sait faire )
pour chaque champ de texte ( <input type="text" /> )
- si le champ n'est pas vide tu passes ton chemin
- sinon
- tu envoies une alerte
- tu essaies de renvoyer sur le champ non rempli
- tu arretes la fonction en envoyant 'faux'
- au champ suivant (et puisqu'au champ d'avant on a passé car ok)
on fait la même chose
- et ainsi de suite
Pour les autres éléments (autre que textarea et input-type-text)
la vérification se fera sur le checked (checkbox) si necessaire
if(frm['boiteAcoche_1'].checked) ''; else { bla bla }
La vérification pour les radios-boutons est un peu + compliquée
function valider(){
// tableau des elements du formulaire
var frm = document.forms['bonjour'];
// verif champ 1 ( frm.prenom ou frm[0] ou frm['prenom'] )
// si c'est ok, on ne fait rien
if(frm.elements['prenom'].value != "") '';
// sinon hop! on prévient, on envoie sur le champ malade
// et on arrete tout
else {
alert("Saisissez le prénom");
with(frm['prenom']) { focus(); select(); }
return false;
}
// ensuite faire pareil pour les autres champs de texte
if(frm.elements['nom'].value != "") '';
else {
alert("Saisissez le nom");
with(frm['nom']) { focus(); select(); }
return false;
}
if(frm.elements['surnom'].value != "") '';
else {
alert("Saisissez le surnom");
with(frm['surnom']) { focus(); select(); }
return false;
}
// et on fini, une fois que tt a été vu, par l'envoi de 'vrai'
return true;
}
L'envoi de vrai permet enfin au submit de faire son travail
sinon auparavant et si erreur l'envoi de faux arrêtait la soumission.
--
Stephane Moriaux et son [moins] vieux Mac
Merci, Stéphane, pour ces lumineuses explications !
Par contre, et comme j'aime me compliquer la vie en dépit de mon
ignorance, je me pose deux nouvelles questions :
- puis-je à partir de mon script personnaliser la couleur du focus
lorsque le champ est en erreur ?
- comment puis-je, toujours dans ce script, valider un champ "mel" et
détecter la présence d'un "@" (vérification certes simpliste...).
Mille mercis.
Cordialement,
Vincent
::- comment puis-je, toujours dans ce script, valider un champ "mel" et
::détecter la présence d'un "@" (vérification certes simpliste...).
1° -> voir http://spod.cx/stuff/answer.gif
2° -> avec une fonction du genre :
function checkMail() {
var x = document.forms[0].email.value;
var filter =
/^([a-zA-Z0-9_.-])+@(([a-zA-Z0-9-])+.)+([a-zA-Z0-9]{2,4})+$/;
if (filter.test(x))
alert('YES! Correct email address');
else
alert('NO! Incorrect email address');
}
trouvée sur : http://www.quirksmode.org/js/mailcheck.html
:)))
f.style.backgroundColor = 'yellow';
pour çà il y a des tas de soluces et d'exemples
et l'expérience montre que çà ne sert absolument à rien
m'enfin ... un exemple dans le code de :
http://perso.wanadoo.fr/stephane.mo...rmsite.htm
--
Stephane Moriaux et son [moins] vieux Mac
reposée.
Amitiés,
Vincent