Checkboxes au moins une mais pas plus de 5

Version imprimable

Bonsoir, voila , je rencontre un soucis que je ne sais résoudre,
Je dispose de 18 checkbox sur ma page PHP,
et je voudrais obliger les personne a en cocher au moin une mais pas plus de 5 , je ne sais pas comment faire ,

je dispose de se code
Code: javascript
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <script language="javascript"> function test() { var m=0; for (i=1;i<19;i++) { if (eval("document.forms.e.checkbox"+i+".checked == true")){ m=m+1; } } if (m>=6) { alert("Vous ne pouvez pas cocher plus de 5 chats"); $}else { alert("Vous devez cocher au moin 1 chat"); } } </SCRIPT>
MERCI

essaie cette fonction:

Code:

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
 
 
function test() 
	{
	var tab=document.forms.e.getElementsByTagName('input');
	var i=0;
	var m=0;
	while(i<tab.length)
		{
		if(tab[i].checked)
			{
			m++;
			}
		i++;
		}	
 
 
	if (m==0) 
		{
		alert("Vous devez cocher au moin 1 chat");		
		}
		else if(m>5)
		{
		alert("Vous ne pouvez pas cocher plus de 5 chats");
		}
	}

Bonjour,
oui.
Et avec, dans l'ordre, une petite amélioration de syntaxe, un test en plus pour éviter d'accéder à des propriétés inexistantes (si type="text", par exemple), et les return pour pouvoir utiliser cette fonction dans le onsubmit du <form> (ce qui semble le plus logique, vu le cas), ça donnerait :
Code:

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 function test() { var tab=document.forms['name_du_form'].getElementsByTagName('input'); var i=0; var m=0; while(i<tab.length) { if(tab[i].checked) if(tab[i].type=='checkbox') m++; i++; } if (m==0) { alert("Vous devez cocher au moin 1 chat"); return false; } else if(m>5) { alert("Vous ne pouvez pas cocher plus de 5 chats"); return false; } return true; }
;)

A+

Bonjour,

Et pour éviter la boucle, on peut aussi utiliser une variable globale :

Code:

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
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
  <head>
    <title>Bienvenue sur mon site !</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <link rel="stylesheet" media="screen" type="text/css" title="Design" href="essaie.css" />
    <script type="text/javascript">
      var nbCoche = 0;
      var max = 5;
      var min = 1;
 
      function compte(obj)
      {
        var valide = true;
 
        if (obj.checked)
          nbCoche ++;
        else
          nbCoche --;
 
        if (nbCoche > max)
        {
          alert(max + ' cases cochées maxi')
          nbCoche --;
          valid = false;
        }
        return valide;
      }
 
      function validForm()
      {
        var valide = true;
 
        if (nbCoche < min)
        {
          alert ('vous devez cocher au moins ' + min + ' case')
          valid = false;
        }
        return valide;
      }
    </script>
  </head>
  <body>
    <form name="test" method="post" action="" onsubmit="return validForm()">
      1&nbsp;<input type="checkbox" name="chk[]" value="1" onclick="return compte(this)" /><br />
      2&nbsp;<input type="checkbox" name="chk[]" value="2" onclick="return compte(this)" /><br />
      3&nbsp;<input type="checkbox" name="chk[]" value="3" onclick="return compte(this)" /><br />
      4&nbsp;<input type="checkbox" name="chk[]" value="4" onclick="return compte(this)" /><br />
      5&nbsp;<input type="checkbox" name="chk[]" value="5" onclick="return compte(this)" /><br />
      6&nbsp;<input type="checkbox" name="chk[]" value="6" onclick="return compte(this)" /><br />
      7&nbsp;<input type="checkbox" name="chk[]" value="7" onclick="return compte(this)" /><br />
      8&nbsp;<input type="checkbox" name="chk[]" value="8" onclick="return compte(this)" /><br />
      9&nbsp;<input type="checkbox" name="chk[]" value="9" onclick="return compte(this)" /><br />
      10&nbsp;<input type="checkbox" name="chk[]" value="10" onclick="return compte(this)" /><br />
      11&nbsp;<input type="checkbox" name="chk[]" value="11" onclick="return compte(this)" /><br />
      12&nbsp;<input type="checkbox" name="chk[]" value="12" onclick="return compte(this)" /><br />
      13&nbsp;<input type="checkbox" name="chk[]" value="13" onclick="return compte(this)" /><br />
      14&nbsp;<input type="checkbox" name="chk[]" value="14" onclick="return compte(this)" /><br />
      15&nbsp;<input type="checkbox" name="chk[]" value="15" onclick="return compte(this)" /><br />
      16&nbsp;<input type="checkbox" name="chk[]" value="16" onclick="return compte(this)" /><br />
      17&nbsp;<input type="checkbox" name="chk[]" value="17" onclick="return compte(this)" /><br />
      18&nbsp;<input type="checkbox" name="chk[]" value="18" onclick="return compte(this)" /><br />
      <br />
      <input type="submit" name="btn" value="valider" />
    </form>
  </body>
</html>

Merci de toute vos réponse,(je penser que l'on recevez un mail lorsqu'une réponse était poster, je viens de voir toutes vos réponses )

J'ai bidouller un peu le tout est celui si fonctionne, mais et il vraiment correct pour vous?
Code:

1 2 3 4 5 6 7 8 9 10 11 12 function test() { var m = 0; for (i=1;i<19;i++) { if (eval("document.forms.e.checkbox"+i+".checked == true")) m++; } if(m == 0) alert("Vous devez cocher au moin 1 chat"); else if (m >= 6) alert("Vous ne pouvez pas cocher plus de 5 chats"); } </SCRIPT>

16/07/2009, 20h41
jnore

Je ne vois pas l'intéret de mettre dans une chaine de caractère ""document.forms.e.checkbox" pour l'évaluer après.
C'est complètement anti-performant et inutile!
16/07/2009, 20h47
skiller

Donc pour toi , quel est le code le mieu parmis les reponse proposer?
(j'y connais tros rien en JS)
Soyé sympa :D
16/07/2009, 22h54
jnore

Prends celui d'E.Bzz qui apporte une amélioraton par rapport à ma proposition.
Il fera largement l'affaire.
Essaie de le comprendre.
Ce serait dommage de l'écrire bêtement.;)
Si t'as besoin d'aide, tu sais où il faut s'adresser !!:zoubi:

Merci de ta fidélité, ^^

Le code ne fonctionne pas
Code:

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 <script language="javascript"> function test() { var tab=document.forms['name_du_form'].getElementsByTagName('input'); var i=0; var m=0; while(i<tab.length) { if(tab[i].checked) if(tab[i].type=='checkbox') m++; i++; } if (m==0) { alert("Vous devez cocher au moin 1 chat"); return false; } else if(m>5) { alert("Vous ne pouvez pas cocher plus de 5 chats"); return false; } return true; } </SCRIPT>
Je voudrai rajouter que je par la suite je veut que lorsque l'on clique sur le bouton Tester , je souhaite qu'un fenêtre s'ouvre avec certaines conditions que j'exposerai une fois se problème résolu.

http://xmen-gay.ovh.org/

il faut renseigner le nom du formulaire:

Code:

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
 
function test() 
{
var tab=document.forms['e'].getElementsByTagName('input');
var i=0;
var m=0;
while(i<tab.length)
	{
	if(tab[i].checked)
        	if(tab[i].type=='checkbox')
			m++;
	i++;
	}	
 
if (m==0) 
{
	alert("Vous devez cocher au moin 1 chat");
        return false;
}
else if(m>5)
{
	alert("Vous ne pouvez pas cocher plus de 5 chats");
        return false;
}
return true;
}

17/07/2009, 09h29
E.Bzz

C'est ça :ccool:

@skiller : pour remplacer cette instruction effectivement peut recommandable :aie:

Code:

eval("document.forms.e.checkbox"+i+".checked == true")

tu peux utiliser cette syntaxe plus valide (et plus pratique pour gérer les name dynamiques) pour accéder aux éléments d'un formulaire :

Code:

document.forms['e'].elements['checkbox'+i].checked

Citation:

Envoyé par skiller

(je penser que l'on recevez un mail lorsqu'une réponse était poster, je viens de voir toutes vos réponses )

Tu peux modifier ça dans les "Paramètres et options" de ton "tableau de bord" ;)

A+
17/07/2009, 11h50
skiller

Effectivement,cela va mieu, quel mal adresse de ma part.
Aller tester

Je vous véneres^^

Merci beaucoup de toute vos réponse et votre soutien.

Je vien d'ouvrir une nouvelle discussion , si vous pouvez jetter un petit coup d'oeuil ^^ ICI

MERCI ALL