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

**JackBeauregard** · 30/12/2006, 18h04

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.

merci d'avance

**Auteur** · 30/12/2006, 22h02

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 :

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
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>

**Sancho_54** · 30/12/2006, 22h08

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 :

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

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

**JackBeauregard** · 31/12/2006, 03h08

Génial, un grand merci à vous les gars

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.

**JackBeauregard** · 31/12/2006, 03h16

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

**Auteur** · 31/12/2006, 14h49

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")

**JackBeauregard** · 31/12/2006, 15h49

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

Je ne sais pas.

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

Oui

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.

**Auteur** · 31/12/2006, 19h01

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").

**JackBeauregard** · 31/12/2006, 19h51

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.

**JackBeauregard** · 31/12/2006, 20h31

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é ?

**Auteur** · 01/01/2007, 13h05

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 :

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
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>

**JackBeauregard** · 02/01/2007, 00h09

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

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

**Colbix** · 06/08/2007, 21h32

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 :

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
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 !

**Auteur** · 07/08/2007, 08h56

bonjour,

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

Code html :

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

1
2
<form action='page.html' method='post' onsubmit='return valider();'>

cf. également
http://javascript.developpez.com/faq...s#ControleForm

**Colbix** · 07/08/2007, 12h06

Merci, ca fonctionne parfaitement

!
Je n'avais pas fait attention au form... Sorry :s

A bientôt

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

JavaScript

Discussions similaires

Partager

Partager