Discussion :

[voyageurdumonde]

Bonjour,

Comment s'assurer que au moins une checkbox a ete coche avant d'envoyer un form.

J'ai ecrit cela mais ca ne fonctionne pas.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<script type="text/javascript">
function verif()
{
if(box[].checked)
{ return true; }
else { alert("Validez au moins une checkbox\n"); 
return false; } }
</script>
 
.......
 
<form name="mapimp"  action="">
<?php
$box=$_POST['box'];
?>	
<tr><td class="nom_type" colspan="2"><input type=checkbox name=box[] value='.$result["id"].'> </td></tr>
 
.......
 
<input type="button" name="t11" value="Affichez sur la carte" onclick="verif();document.mapimp.target='mappy'; envoyer_form('map.php'); "/>

Merci

[vermine]

Bonjour,

Vous pouvez toujours regarder cet exemple-ci.
Comprenez bien que vous devez récupérer les champs avant de faire une vérification dessus.

Et le name de votre checkbox n'est peut-être pas judicieux. La notion de tableaux apparaitra lorsque vous ferez la recherche sur les éléments qui ont le même name :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type=checkbox name=box value='.$result["id"].'>

[voyageurdumonde]

Salut Vermine,

Je ne suis pas sur de te comprendre, je voudrais juste pourvoir valider que au moins une case a ete cochee.
Meme si je retire les crochet apres box ca ne fonctionne toujours pas

Merci

[vermine]

Oui parce qu'en fait il faut récupérer avant toutes les cases de ce nom-là :

Code js :

Sélectionner tout - Visualiser dans une fenêtre à part

document.nomduform.nomdescases

Ce qui renvoie un tableau :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
document.nomduform.nomdescases[0]
document.nomduform.nomdescases[1]
...

[vermine]

Ha euh, je n'avais pas vu non plus que vous étiez sur un input de type bouton et que vous lanciez plusieurs fonctions. Du coup, il faudra faire en sorte de ne pas appeler les autres fonctions lorsque vous renvoyer false.

[voyageurdumonde]

Ok merci Vermine, ca semble plutôt complique a faire, je pense que je vais plutôt vérifier si ma variable box contient quelques chose. Si celle-ci est vide je n'aurais plus qu'a lancer une alert.

Cela est-il une bonne idée?

[Watilin]

En fait le name avec crochets permet de récupérer un tableau côté serveur. Donc, c’est à garder !

Le truc qui coince, je pense, c’est là :

Code JS :

Sélectionner tout - Visualiser dans une fenêtre à part

if(box[].checked)

Il faut récupérer la liste de toutes les boîtes :

Code JS :

Sélectionner tout - Visualiser dans une fenêtre à part

var boxes = document.getElementsByName('box[]');

Ensuite, une tite boucle for :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
var noChecked = true;
for (var i = boxes.length; i-- && noChecked;) {
	if (boxes[i].checked) {
		noChecked = false;
	};
};
if (noChecked) {
	alert('Pas bien !');
};

Je boucle à l’envers pour éviter de faire le test sur length à chaque tour, car le sens de la boucle n’a pas d’importance.
Si une case cochée a été trouvée, noChecked passe à false et on sort de la boucle ; si i arrive à 0, noChecked reste à true et on peut engueuler l’utilisateur.

[vermine]

Diablerie ! Je n'avais pas pensé au PhP ! Pardon pour le nom box[].

Par contre, la boucle de Watilin est sensiblement la même que celle de la Faq dont j'ai donné le lien plus haut (même si je préfère celle de Watilin).

[voyageurdumonde]

Super ca fonctionne, Merci Watilin et Vermine

voici le code au complet

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<script type="text/javascript">
 
function verif(){
 
var boxes = document.getElementsByName('box[]');
 
var noChecked = true;
 
for (var i = boxes.length; i-- && noChecked;) {
	if (boxes[i].checked) {
		noChecked = false;
	};
};
if (noChecked) {
	alert('Veuillez selectionner au moins une adresse !');
};
};
 
</script>
 
.......
 
<form name="mapimp"  action="">
<?php
$box=$_POST['box'];
?>	
<tr><td class="nom_type" colspan="2"><input type=checkbox name=box[] value='.$result["id"].'> </td></tr>
 
.......
 
<input type="button" name="t11" value="Affichez sur la carte" onclick="verif();document.mapimp.target='mappy'; envoyer_form('map.php'); "/>

[voyageurdumonde]

Par contre autre probleme je voudrais valider que la fonction est ok avant d'envoyer le submit j'utilise donc un if dans la commande suivante:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<input type="button" name="t11" value="Affichez sur la carte" onclick="if(verif())envoyer_form('map.php');document.mapimp.target='mappy';"/>

Si rien 'est coche j'ai l'alerte et i je coche une checkbox plus d'alerte mais rien n'est envoye.

[vermine]

Vous devez renvoyer une valeur dans votre fonction verif(). A savoir, true quand noChecked est faux et false quand noChecked est vrai.

Code js :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
for (var i = boxes.length; i-- && noChecked;) {
	if (boxes[i].checked) {
		//noChecked = false;
                          return true;
	};
};
if (noChecked) {
	alert('Veuillez selectionner au moins une adresse !');
             return false;
};

Lorsque le code réalise l'instruction return, il quitte la fonction.

[voyageurdumonde]

Ca fonctionne toujours pas

J'ai essaye

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
onclick="if(verif())return (document.mapimp.target='mappy'&& envoyer_form('map.php');)"
 
onclick="if(verif()) {document.mapimp.target='mappy' && envoyer_form('map.php');}"

ou encore

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
onclick="if(verif()) {document.mapimp.target='mappy' ; envoyer_form('map.php');}"

mais aucune de ces solutions n'aboutis au résultat voulu.

[voyageurdumonde]

J'ai enfin trouve la bonne syntaxe:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

onclick="if(verif(this.form)!== false) {document.mapimp.target='mappy';envoyer_form('map.php');}"/>

[vermine]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
onclick="if(return verif()) {document.mapimp.target='mappy';envoyer_form('map.php');}"/>