Formulaire+checkbox

Signaler
Messages postés
42
Date d'inscription
samedi 19 mars 2005
Statut
Membre
Dernière intervention
17 juillet 2007
-
Messages postés
74
Date d'inscription
jeudi 6 mars 2003
Statut
Membre
Dernière intervention
5 juin 2008
-
Bonjour,





je suis un débutant en javascript et je compte écrire du code
javascript générique visant la validation de n'importe quel formulaire
indépendemment de ses champs.




J'ai commencé par implémenter une fonction qui vérifie que les
champs ne sont pas vides, mais j'ai rencontré un pb au niveau des
checkbox.




Voilà mon code accompagné du formulaire, merci de vouloir m'aider à
pouvoir valider les checkbox mais aussi si vous pouvez me proposer des
idées d'optimisation je serais vraiment reconnaissant.





MERCI!





CODE





<HTML>


<HEAD>


<link rel="stylesheet" type="text/css" href="style.css">


<SCRIPT LANGUAGE="javascript">


function tester(nbform)


{


for (i=0; i<nbform; i++) //on parcoure tous les formulaires de la page HTML


{


var formulaire=document.forms[i];


for (n=0; n<formulaire.elements.length;n++) //On parcoure tous les champs de saisie de chaque formulaire


{


switch (formulaire.elements[n].type) // On traite chaque champs de saisie selon son type


{


case "text":


if (formulaire.elements[n].value=="")


{


alert("champs texte vide!");


//formulaire.elements[n].style.backgroundColor="#DC143C";


return false;


}


//write(formulaire.elements[n].value);


break;





case "password":


if (formulaire.elements[n].value=="")


{


alert("champs password vide!");


//formulaire.elements[n].style.backgroundColor="#DC143C";


return false;


}


//write(formulaire.elements[n].value);


break;





case "textarea":


if (formulaire.elements[n].value=="")


{


alert("champs textarea vide!");


//formulaire.elements[n].style.backgroundColor="#DC143C";


return false;


}


//write(formulaire.elements[n].value);


break;








case "select-one":


champs = eval('formulaire.elements[n].options[formulaire.elements[n].selectedIndex].value');





if (champs=="-20")


{


alert("Sélectionnez un élément de la liste!");


//formulaire.elements[n].style.backgroundColor="#DC143C";


return false;


}


//write(formulaire.elements[n].value);


break;





case "radio":


champs = eval('formulaire.elements[n].name');


var err=true;


for ( var n=0;n<formulaire[champs].length;n++ )


{ if ( formulaire[champs][n].checked )


{ err=false;


n=champs.length; } }


if ( err )


{ alert("Sélectionnez un bouton radio!");


//formulaire.elements[n].style.backgroundColor="#DC143C";


return false; }





//write(formulaire.elements[n].value);


break;





case "checkbox":


champs = eval('formulaire.elements[n].name');


var err=true;


for ( var n=0;n<formulaire[champs].length;n++ )


{ if ( formulaire[champs][n].checked )


{ alert("checked!"); //pour tester qu'il entre dans la boucle.


err=false;


n=champs.length; } }


if ( err )


{ alert("Sélectionnez un checkbox!");


//formulaire.elements[n].style.backgroundColor="#DC143C";


return false; }





//write(formulaire.elements[n].value);


break;





default:


alert(formulaire.elements[n].type);


break;








}





}


alert("Formulaire saisi avec succés!");


}


}





</script>





</HEAD>








<FORM Name="formulaire" method="Post" Action="" onsubmit="Javascript:return tester(1);">


Civilit&eacute; (sans repositionnement sur un item):,

<select name="CIVILITE">

<option value="-20">- Sélectionnez -</option>

<option value="1">Mr</option>

<option value="2">Mlle</option>

<option value="3">Mme</option>

</select>,

----

Situation (avec repositionnement sur l'item 1):,

<select name="SITUATION">

<option value="-20">- Sélectionnez -</option>

<option value="1">Célibataire</option>

<option value="2">Divorcé</option>

<option value="3">Marié</option>

</select>,

----

Nom :,

,

----

Mot de passe,

,

----

Confirmation du mot de passe,

,

----

Code postal :,

,

----

Saisissez votre email :,

,

----

Adresse:,

<textarea name="adresse" id="adresse"></textarea>,

----

Pays:,

<select name="pays" id="pays">

<option value="-20" selected>- S&eacute;lectionnez -</option>

<option value="1">Belgique</option>

<option value="2">France</option>

</select>,

----

Niveau:,

Etudiant

Professionnel,

----

Comp&eacute;tences:,

SGBD

UNIX

Dev Web,

----

,

&nbsp;










</FORM>





</HTML>

4 réponses

Messages postés
74
Date d'inscription
jeudi 6 mars 2003
Statut
Membre
Dernière intervention
5 juin 2008

Bonjour,


Sit tu veux tester si tous tes checkbox sont cochés, il te suffit de remplacer dans ton code :


> case "checkbox":
> if (formulaire.elements[n].checked == false) {
> alert("Sélectionnez un checkbox!");
> return false;
> }
> break;
Messages postés
74
Date d'inscription
jeudi 6 mars 2003
Statut
Membre
Dernière intervention
5 juin 2008

Bonjour,

g pas tout posté :-)

voilà voilà :

> case "checkbox":
> champs = eval('formulaire.elements[n].name');


> if (formulaire[champs].length > 0) {
> var err=true;


> for ( var n=0;n<formulaire[champs].length;n++ )
> { if ( formulaire[champs][n].checked )
> { alert("checked!"); //pour tester qu'il entre dans la boucle.
> err=false;
> n=champs.length; } }
> if ( err )
> { alert("Sélectionnez un checkbox!");
> //formulaire.elements[n].style.backgroundColor="#DC143C";
> return false; }
> } else {
> if (formulaire.elements[n].checked == false) {
> alert("Sélectionnez un checkbox!");
> return false;
> }
> }


> //write(formulaire.elements[n].value);
> break;
Messages postés
42
Date d'inscription
samedi 19 mars 2005
Statut
Membre
Dernière intervention
17 juillet 2007

Merci steph666 pour ton aide mais j'ai enfin découvert le pb, les checkbox n'avaient pas le même nom.
Messages postés
74
Date d'inscription
jeudi 6 mars 2003
Statut
Membre
Dernière intervention
5 juin 2008

Oui c pour ça que je t'ai posté une solution qui prévoit le cas où ils portent le même nom, et celui où ils ont des noms différents., j'aurais peut-être du préciser.