verifier si checkbox sont cochées

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : verifier si checkbox sont cochées

par Ryle » 29 sept. 2006, 12:00

Tu y es presque pour le onClick : la syntaxe est bonne, mais si tu fais un "return" du résultat renvoyé par la première fonction, tu vas arrêter le traitement et tu n'iras jamais appeller la seconde :)

Pour les cases, apriori javascript semble faire une différence entre list[1] et list[7] alors qu'il n'en fait pas si tu utilises juste list[].
Ceci t'oblige donc à boucler sur tous les elements du formulaire (d'où le for()) pour trouver lesquels sont des cases à cocher (le if()) avant de savoir si au moins l'une d'entre elles est cochée (et là ben t'as pas fait de test mais directement ton alert :))

Comme je te l'ai dit, quand cela ne fonctionne pas, place des alert pour vérifier les valeurs : est ce que tu rentres dans ton for() ? quelle valeur à document.validation.listes.length ? est ce que document.validation.listes existe bien pour chaque valeur de i que tu lui passes ? quelles valeur prend i ? quelles valeurs devrait il prendre ? comment les lui faire avoir ?
Tu peux trouver tout ça et résoudre la majorité des bugs comme ça, juste en plaçant quelques alert() :)

par meta » 28 sept. 2006, 12:24

pour le OnClick, genre comme ca : onClick="return checkform();return control_list()"> ?

Et pour la boucle, ce code la est til correct, ou que me manque t il , car la que ce soit coche ou pas il ne se pass rien :/ as tu une idée par hasard ?

Code : Tout sélectionner

<script> function control_list(){ // boucle sur tous les éléments du formulaire for(var i=0; i < document.validation.listes[i].length; i++) { if(document.validation.listes[i].type == "checkbox") { // si l'élément est une case à cocher alert("cochez au moins une case"); } } </script> <form method="post" name="validation" > liste 1 <input type="checkbox" name="listes[1]" value=signup /> liste 1 <input type="checkbox" name="listes[7]" value=signup /> <input type=button name=Submit value=Envoyer onclick="return control_list();" /> </form>

par Ryle » 28 sept. 2006, 12:11

Si les noms sont différentes, tu peux écrire ta boucle ainsi :

Code : Tout sélectionner

// boucle sur tous les éléments du formulaire for(var i=0; i < document.nom_formulaire.elements.length; i++) { if(document.nom_formulaire.elements[i].type == "checkbox") { // si l'élément est une case à cocher ... } }
Quant à ton onClick, tu peux lui demander d'exécuter plusieurs instructions javascript à la suite sans problème, il suffit de les séparer par des ";" :)

par meta » 28 sept. 2006, 10:49

hum merci pour les explications.

1. Et donc si j'ai plusieurs listes :

Code : Tout sélectionner

<input type="checkbox" name="list[2]" value=signup /> <input type="checkbox" name="list[9]" value=signup /> <input type="checkbox" name="list[17]" value=signup />

Quelle serait la syntaxe a avoir pour boucler et controler sur tout les controles ?


2. comment je peux my prendre si le onclick de mon submit est deja occupé par une fonction JS ?

Wala Merci d'avance de ton aide. :)

par Ryle » 28 sept. 2006, 10:38

Oki, c'est parce que dans l'exemple que tu donnais au dessus, toutes tes listes étaient déclarées en tableau et avaient le même nom (list[1], list[7])

Ton problème vient toujours du fait qu'avec un seul champ, l'attribut .length n'est pas défini si tous tes champs ont un nom unique, la boucle sur document.nom_formulaire.nom_champ.length ne fonctionnera jamais :)

J'ai un peu de mal à comprendre exactement ce que tu veux faire... tu souhaites tester tous tes champs du formulaire en partant du principe que tu ne connais pas leurs noms ? Dans ce cas tu peux boucler sur le tableaux elements[] :

En fait, la syntaxe document.nom_formulaire.nom_champ est une écriture simplifiée de document.forms['nom_formulaire'].elements['nom_champ'].
forms[] : est un tableau listant tous les formulaires de la page
elements[] : est un tableau listant tous les champs du formulaire

Tu peux donc boucler sur tous les champs d'un formulaire donné et les tester un à un :)

par meta » 28 sept. 2006, 10:34

ah merci, je pense que je vais faire liste par liste. La le code marchait, mais comment je peux my prendre si le onclick de mon submit est deja occupée par une fonction JS ?

par Ryle » 28 sept. 2006, 10:02

Le problème que tu rencontres vient du fait qu'il n'y a dans ton formulaire qu'un seul champ "list". Du coup il n'est pas considéré comme un tableau, l'attribut ".length" n'est pas défini et par conséquent il ne rentre pas dans ton for() :)

Ajoute un deuxième champ (ou plus) avec le même nom, et tu devrais avoir ce que tu attends :) Attention toutefois dans ta boucle, ton message d'alerte ne correspond pas au test que tu fais (si .checked est vrai, c'est que la case est cochée :)) il te faudra donc légèrement revoir cette partie là...

N'hésite pas en javascript à placer des alert() régulièrement pour vérifier si tu rentre dans les boucles, les if ou simplement tester les valeurs :

Code : Tout sélectionner

alert(document.validation.list.length)
Pour gérer le cas ou tu n'as qu'un seul champ, tu peux tester si le .length est défini : si c'est le cas, c'est un tableau, tu fais ta boucle, sinon, ce n'est pas un tableau et tu n'as qu'un seul élément à tester :

Code : Tout sélectionner

if(document.validation.list.length) { // deux champ ou plus for(...) { ... } } else { // un seul champ if(document.validation.list.checked) alert("Il n'y a qu'une seule case, cochée"); else alert("Il n'y a qu'une seule case, non cochée"); }

par meta » 27 sept. 2006, 23:17

Re, bon j'ai commence a tester le controle sur UNE liste (et faire pareil avec les autres apres). Mais quand j'appuie sur le submit i ne se passe rien, alors qu'ild evrai m'afficher 'case pas cochée' ? savez vous ce qui ne va pas ?

Code : Tout sélectionner

<script> function control_list(){ for (i=0; i<document.validation.list.length; i++) { if (document.validation.list[i].checked) alert("case pas cochee"); else return true; } } </script> <form method="post" name="validation" > liste 1 <input type="checkbox" name="list" value=signup /> <input type=button name=Submit value=Envoyer onclick="return control_list();" /> </form>

par Ryle » 27 sept. 2006, 12:11

Et ben c'est le moment de progresser en javascript ! ;)

Montre nous plutot ton code avec tes listes à partir de mes explications :) On corrigera ensemble ce qui ne va pas, et s'il y a des choses pas clair en js, tu pourras toujours poser la question pour qu'on puisse t'expliquer :)

Et puis comme ça, la prochaine fois tu pourras clamer haut et fort "Je suis pas trop doué en JS, mais ce machin là, je sais le faire !" ;)

par meta » 27 sept. 2006, 11:29

euh salut Ryle. Je suis pas trop doué en JS, concretement ca donnerait koi ton code avec mes listes ? :shock:

par Ryle » 27 sept. 2006, 11:22

Personnellement je mettrais le même code que pour vérifier si une case est cochée, sauf que comme j'ai un tableau, je ferais une boucle dessus et sortirais dès que j'en trouve une de cochée :)

Code : Tout sélectionner

tantQue (il a des cellule dans le tableau) si (la case est cochée) retourne "tout va bien" fin si fin tantQue retourne "tout va mal"
Pour t'aider :

document.nom_formulaire.nom_champ.length : indique la taille du tableau
document.nom_formulaire.nom_champ[x] : identifie l'élément x du tableau
document.nom_formulaire.nom_champ[x].checked : permettant de savoir si l'élément x du tableau est coché ou non :)

verifier si checkbox sont cochées

par meta » 27 sept. 2006, 11:13

bjour. Voila j'avas vu un script permettant de verifier si des checkbox ont été cochées ou pas, mais ce script se basait sur la valeur name, et mes valeurs sont differentes pour chaque case.

Quel code meteriez vous pour afficher dans une box 'alert', si aucune liste n'est encore cochée ? Merci d'avance de votre aide. :)

Code : Tout sélectionner

<ul class="list"> <li class="list"> <input type="checkbox" name="list[1]" value=signup /> moto <div class="listdescription"> <input type=hidden name="listname[1]" value="moto"/> </div> </li> <li class="list"> <input type="checkbox" name="list[7]" value=signup /> auto <div class="listdescription"> <input type=hidden name="listname[7]" value="auto"/> </div> </li>