Je souhaiterai valider un formulaire en JavaScript.
J'ai trouv=E9 sur l'excellent
http://www.openweb.eu.org/articles/validation_formulaire/
un article =E0 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=EAte :
function valider(){
frm=3Ddocument.forms['bonjour'];
if(frm.elements['prenom'].value !=3D "") {
return true;
}
else {
alert("Saisissez le pr=E9nom");
return false;
}
}
'bonjour" est le nom de mon formulaire, 'prenom' est le champ =E0
tester.
Jusque l=E0, l'instruction fonctionne.
En revanche, je m'interroge sur la fa=E7on de proc=E9der pour ajouter un
deuxi=E8me contr=F4le du m=EAme type, par exemple pour un champ 'nom'.
J'ai essay=E9 d'imbriquer des if et des elseif, mais =E7a ne fonctionne
pas...
Si je cr=E9=E9e deux fichiers javaScript, l'un pour le pr=E9nom, l'autre
pour le nom, cette option fonctionne, mais je ne la trouve gu=E8re
=E9l=E9gante...
Aussi souhaiterai-je avoir vos avis et vos conseils pour r=E9soudre mon
probl=E8me.
Cette action est irreversible, confirmez la suppression du commentaire ?
Signaler le commentaire
Veuillez sélectionner un problème
Nudité
Violence
Harcèlement
Fraude
Vente illégale
Discours haineux
Terrorisme
Autre
ASM
Viwiv wrote:
Bonjour,
Je souhaiterai valider un formulaire en JavaScript.
J'ai trouvé sur l'excellent http://www.openweb.eu.org/articles/validation_formulaire/ 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 :
ha! oui ! çà a l'air d'être une fonction donnée au onsubmit du form
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.
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; )
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'.
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
Viwiv wrote:
Bonjour,
Je souhaiterai valider un formulaire en JavaScript.
J'ai trouvé sur l'excellent
http://www.openweb.eu.org/articles/validation_formulaire/
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 :
ha! oui ! çà a l'air d'être une fonction donnée au onsubmit du form
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.
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; )
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'.
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.
Je souhaiterai valider un formulaire en JavaScript.
J'ai trouvé sur l'excellent http://www.openweb.eu.org/articles/validation_formulaire/ 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 :
ha! oui ! çà a l'air d'être une fonction donnée au onsubmit du form
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.
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; )
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'.
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
Viwiv
Bonjour,
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
Bonjour,
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...).
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
kurtz le pirate
In article , "Viwiv" wrote:
::- 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
:)))
In article <1122220524.134591.225480@g49g2000cwa.googlegroups.com>,
"Viwiv" <ooVIWIVoo@gmail.com> wrote:
::- 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
::- 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
:)))
ASM
Viwiv wrote:
Bonjour,
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 ?
f.style.backgroundColor = 'yellow';
- comment puis-je, toujours dans ce script, valider un champ "mel" et détecter la présence d'un "@" (vérification certes simpliste...).
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.moriaux/formsite.htm
-- Stephane Moriaux et son [moins] vieux Mac
Viwiv wrote:
Bonjour,
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 ?
f.style.backgroundColor = 'yellow';
- comment puis-je, toujours dans ce script, valider un champ "mel" et
détecter la présence d'un "@" (vérification certes simpliste...).
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.moriaux/formsite.htm
