Afficher un message d'alerte si plus de 5 checkbox cochés

Version imprimable

30/12/2006, 18h04
JackBeauregard

Afficher un message d'alerte si plus de 5 checkbox cochés

Bonjour,

Comme je suis un gars très intelligent, j'ai besoin d'aide pour réussir à afficher un message d'alerte si le gars valide le formulaire mais a coché plus de 5 checkboxs.:oops:

merci d'avance

bonjour,

Il faut vérifier si chaque case est cochée ou décochée et incrémenter ou décrémenter un compteur.

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
 
<html>
<head>
<title></title>
 
<script type="text/javascript">
<!--
var numCheck = 0;
var checkMax = 5;
function testCheck(obj)
{
  if (obj.checked==true)
    numCheck++;
  else
    numCheck--;
 
  document.getElementById("idOut").innerHTML = numCheck +" cases cochées";
}
 
function valider()
{
 
 if (numCheck>checkMax)
 {
    alert("il faut en cocher moins !!");
    return false;
 }
 else 
      return true;
 return true;
 
}
//-->
</script>
 
</head>
 
<body>
 
<form>
 
  <input type="checkbox" id="idchk1" onclick="testCheck(this)">
  <input type="checkbox" id="idchk2" onclick="testCheck(this)">
  <input type="checkbox" id="idchk3" onclick="testCheck(this)">
  <input type="checkbox" id="idchk4" onclick="testCheck(this)">
  <input type="checkbox" id="idchk5" onclick="testCheck(this)">
  <input type="checkbox" id="idchk6" onclick="testCheck(this)">
 
  <br><br>
 
  <input type="submit" value="Envoyer" onclick="valider()">
  <input type="reset" value="Effacer">
 
</form>
 
<div id="idOut"></div>
 
 
</body>
 
</html>

Tu fais une boucle sur tes element du formulaire et tu vérifie si la case a coché et coché ou non voial comment faire en gros :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
 
 
var compteur = 0; 
for (var i = 0; i < document.forms.length; i++) {
     if(document.forms[i].type== "checkbox"){
          if(document.forms[i].checked == true){
               comteur++:
          }
     }
}
if(compteur > 5 ){
     alert("Ton mesage d'erreur !");
}

Voila en gros ;) previens moi du resultat

31/12/2006, 03h08
JackBeauregard

Génial, un grand merci à vous les gars :hola:

Pour tout dire j'ai pas testé la méthode de Sancho_54, parce que celle en kit proposée par Auteur fonctionne très bien et comme j'ai une légère allergie au javascript, j'aime mieux pas trop m'attarder sur le code. Mais bon, c'est l'intention qui compte ;)

Encore merci à vous deux.
31/12/2006, 03h16
JackBeauregard

Euh... Par contre y'a ce gros lourd d'internet explorer qui me bloque le script et m'affiche le bandeau jaune en haut "pour vous aider à protéger votre ordinateur, internet explorer a restreint l'exécution des scripts gnagnagna gnagnagna".

C'est possible de contourner ça ? Ca le fait pas pour mes autres scripts javascript, par exemple quand j'affiche ou masque une div.

Et là ça le fait :?
31/12/2006, 14h49
Auteur

Citation:

Envoyé par JackBeauregard

Euh... Par contre y'a ce gros lourd d'internet explorer qui me bloque le script et m'affiche le bandeau jaune en haut "pour vous aider à protéger votre ordinateur, internet explorer a restreint l'exécution des scripts gnagnagna gnagnagna".

C'est possible de contourner ça ?

C'est sans doute à cause du bouton valider du formulaire. Après ce message IE ne te propose pas de continuer l'exécution du script (ce qui entraine l'envoi du formulaire) ?

Pour contourner le problème, modifie les options d'IE. (peut-être que dans la boite de dialogue, tu as une case à cocher "Ne plus afficher cet avertissement")
31/12/2006, 15h49
JackBeauregard

Citation:

C'est sans doute à cause du bouton valider du formulaire.

Je ne sais pas.

Citation:

Après ce message IE ne te propose pas de continuer l'exécution du script (ce qui entraine l'envoi du formulaire) ?

Oui

Citation:

Pour contourner le problème, modifie les options d'IE. (peut-être que dans la boite de dialogue, tu as une case à cocher "Ne plus afficher cet avertissement")

Pas pratique, je me vois mal demander à mes visiteurs de le faire exprès pour mon formulaire.
31/12/2006, 19h01
Auteur

Citation:

Pas pratique, je me vois mal demander à mes visiteurs de le faire exprès pour mon formulaire.

Cela dépend des paramètres de tes visiteurs : selon les cas ils verront ou non apparaître le message d'avertissement.

Ce sont des paramètres de sécurité, ce sont les utilisateurs d'IE qui les règlent et là dessus tu ne peux rien y faire. De ton côté, si ce message t'agace tu peux toujours modifier ces paramètres (onglet "sécurité" dans les "options internet").
31/12/2006, 19h51
JackBeauregard

Citation:

Cela dépend des paramètres de tes visiteurs : selon les cas ils verront ou non apparaître le message d'avertissement.

C'est à dire que je n'ai effectué aucun réglage particulier, donc je me dis que la plupart de mes visiteurs auront ce message.

Bon je vais voir ce que je vais faire, peut-être que je vais seulement le faire en PHP. C'est pour ça que j'aime pas javascript, faut toujours s'adapter à tous les clients.
31/12/2006, 20h31
JackBeauregard

Remarques, si ça ne le fait qu'à cause du submit, peut-être est-il possible de ne déclencher l'action que lorsque la 6eme checkbox est cochée, sans attendre que le submit ne soit cliqué ?

Citation:

Envoyé par JackBeauregard

Remarques, si ça ne le fait qu'à cause du submit, peut-être est-il possible de ne déclencher l'action que lorsque la 6eme checkbox est cochée, sans attendre que le submit ne soit cliqué ?

bien sûr :

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
 
<html>
<head>
<title></title>
 
<script type="text/javascript">
<!--
var numCheck = 0;
var checkMax = 5;
function testCheck(obj)
{
  if (obj.checked==true)
  {
     numCheck++;
     if (numCheck>checkMax)
     {
        alert("il faut en cocher moins !!");
        obj.checked = false;
        numCheck--;
     }
  }
  else
    numCheck--;
 
  document.getElementById("idOut").innerHTML = numCheck +" cases cochées";
}
 
//-->
</script>
 
</head>
 
<body>
 
<form>
 
  <input type="checkbox" id="idchk1" onclick="testCheck(this)">
  <input type="checkbox" id="idchk2" onclick="testCheck(this)">
  <input type="checkbox" id="idchk3" onclick="testCheck(this)">
  <input type="checkbox" id="idchk4" onclick="testCheck(this)">
  <input type="checkbox" id="idchk5" onclick="testCheck(this)">
  <input type="checkbox" id="idchk6" onclick="testCheck(this)">
 
  <br><br>
 
  <input type="submit" value="Envoyer">
  <input type="reset" value="Effacer">
 
</form>
 
<div id="idOut"></div>
 
 
</body>
 
</html>

02/01/2007, 00h09
JackBeauregard

Impeccable, merci Auteur, ça fonctionne très bien ! :hola: :P

Merci à Sancho aussi, j'espère qu'il est pas trop vexé parce que j'ai pas testé sa soluce :?

Salut, je voulais faire un script pratiquement pareil, j'ai donc décider d'utiliser le premier script proposé (proposé par "Auteur").

Il détecte bien quand il y a assez de checkbox checked, mais j'ai l'impression qu'il renvoi toujour "true" pcq a chaque fois que je click, il effectue le submit !

ps : je veux en cocher exactement 5 dans ce cas ci !

voici le code pour etre plus directe :

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
        <!--------- Script pour checkbox --------->
        <script type="text/javascript">
        <!--
        var numCheck = 0;
        var checkMax = '.$nbr_check.';
 
        function testCheck(obj)
        {
          if (obj.checked==true)
            numCheck++;
          else
            numCheck--;
 
          document.getElementById("idOut").innerHTML = "<span class=title2>"+ numCheck +" / '.$nbr_check.' </span> joueur(s) qualifiés.";
        }
 
        function valider()
        {
         if (numCheck == checkMax)
         {
            if(window.confirm("Etes vous sur de ne pas avoir faire de faute de frappe et de ne pas avoir laissé de champs vides ?\n(Surtout pour Sonny ;)"))
                {return true;}
            else
                {return false;}
         }
         else
         {
            alert("Trop ou trop peu de joueurs ont été sélectionnés pour le round suivant !");
            return false;
         }
         return false;
        }
        //-->
        </script>
        <!---------/Script pour checkbox --------->

D'ou peut venir cette erreur ?
Merci pour votre aide !

07/08/2007, 08h56
Auteur
bonjour,

dans ta balise form tu n'as pas oublié le return ?
Code:

1 2 <form action='page.html' method='post' onsubmit='return valider();'>
cf. également
http://javascript.developpez.com/faq...s#ControleForm
07/08/2007, 12h06
Colbix

Merci, ca fonctionne parfaitement :) !
Je n'avais pas fait attention au form... Sorry :s

A bientôt :)