Afficher un message d'alerte dès que la sixième case est cochée

**JackBeauregard** · 16/01/2007, 16h14

Bonjour,

Le code ci-dessous permet d'afficher un message d'alerte si le client clique plus de 5 cases :

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
<script type="text/javascript">
<!--
var numCheck = 0;
var checkMax = 5;
function testCheck(obj)
{
  if (obj.checked==true)
  {
     numCheck++;
     if (numCheck>checkMax)
     {
        alert("Vous pouvez indiquer jusqu'à 5 spécialités.");
        obj.checked = false;
        numCheck--;
     }
  }
  else
    numCheck--;
 
  document.getElementById("idOut").innerHTML = numCheck +" cases cochées";
}
 
//-->
</script>
 
dans le form :
<input type="checkbox" name="specialite" value="1" id="1" onclick="testCheck(this)"';>

Le problème c'est que si j'affiche ensuite les 5 cases cochées, après avoir récupéré les avoir id depuis la BD, alors le client peut de nouveau en cocher 5, ce qui peut nous en faire jusqu'à 10.

Donc au premier affichage, le gars peut cliquer 5 cases maxi, ça c'est bon.
Mais ensuite quand la liste s'affiche et que les 5 cases choisies auparavant sont maintenant cochées, alors là le gars doit avoir le message d'alerte dès la sixième case cochée.

J'ai besoin d'aide pour ça, parce que je suis (très) nul en javascript et on m'avait aidé à faire le script ci-dessus.

Merci d'avance.

**SpaceFrog** · 16/01/2007, 16h18

heu les 5 premières j'ai à peu près compris ... mais les cinq suivantes je vois plus là ...

ton code marche bien si il y a 6 checks sur la page ...

**JackBeauregard** · 16/01/2007, 16h35

Ok, je réexplique.

1)
- J'ai une page avec 30 checkbox.
- T'arrives sur la page.
- T'en cliques de 1 à 5 c'est ok.
- Si t'en cliques une sixième, l'alerte se déclenche.
- Tu valides le formulaire.
2)
- Tu reviens sur la page.
- Les 1 à 5 cases que tu avais sélectionné apparaîssent déjà cochées.
- Si tu en avais choisi qu'une, elle apparait donc déjà cochée.
- La logique veut donc que tu puisses maintenant en cocher 4 autres.
- Mais pas de pot, le script t'autorise à en choisir 5 autre et là seulement il affiche l'alert. Mais du coup t'en a 6 au lieu de 5, la limite est franchie.

Donc le script doit détecter le nombre de case éventuellement déjà cochées

**SpaceFrog** · 16/01/2007, 17h03

pour commencer ... un id doit être unique sur la page !!!!

ensuite passe par la collection des names ...

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>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
 
<title>Nouvelle page 1</title>
 
<script type="text/javascript">
<!--
var numCheck = 0;
var checkMax = 5;
 
function testCheck(obj)
{
 numCheck=0
 var checkSetName=obj.name
 var checkSet=document.getElementsByName(checkSetName)
 
 for (i=0;i<checkSet.length;i++){
  	if (checkSet[i].checked){
  		   numCheck++;}
 
   if (numCheck>checkMax)     {
        		alert("Vous pouvez indiquer jusqu'à 5 spécialités.");
        		obj.checked = false;
            }
 
  }
 
  document.getElementById("idOut").innerHTML = numCheck +" cases cochées";
}
//-->
</script>
</head>
 
 
 
<body>
 
<input type="checkbox" name="specialite" value="1"  onclick="testCheck(this)";>
<input type="checkbox" name="specialite" value="1"  onclick="testCheck(this)";>
<input type="checkbox" name="specialite" value="1"  onclick="testCheck(this)";>
<input type="checkbox" name="specialite" value="1"  onclick="testCheck(this)";>
<input type="checkbox" name="specialite" value="1"  onclick="testCheck(this)";>
<input type="checkbox" name="specialite" value="1"  onclick="testCheck(this)";><br/>
<input type="checkbox" name="aa" value="1"  onclick="testCheck(this)";>
<input type="checkbox" name="aa" value="1"  onclick="testCheck(this)";>
<input type="checkbox" name="aa" value="1"  onclick="testCheck(this)";>
<input type="checkbox" name="aa" value="1"  onclick="testCheck(this)";>
<input type="checkbox" name="aa" value="1"  onclick="testCheck(this)";>
<input type="checkbox" name="aa" value="1"  onclick="testCheck(this)";>
 
<div id='idOut'></div>
</body>
 
</html>

Afficher un message d'alerte dès que la sixième case est cochée

JavaScript

Discussions similaires

Partager

Partager