imbrication de checkbox

**jpsegret** · 06/06/2007, 20h42

Bonsoir a tous,
Je suis en train de cr�er une arborescence de checkbox
ex:
checkbox1
checkbox1.1
checkbox 1.1.1
checkbox 1.1.1.1
checkbox2
....
...
Je voudrais savoir si vous saviez comment faire pour que quand je clique sur la checkbox mere(checkbox1) cela coche tte les autres imbriqu�es(tt sauf la checkbox2)
de meme pour la checkbox 1.1 et 1.1.1

Je tiens a preciser que ce sont des checkbox cr�es dynamiquement en jsp.

Merci d'avance,

**Auteur** · 06/06/2007, 23h31

bonjour,

voici un script :

Code html :

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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<title></title>
 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="fr" />
 
<style type="text/css">
<!--
.marge{
 margin-left: 20px;
}
 
.marge2{
 margin-left: 40px;
}
 
//-->
</style>
 
<script type="text/javascript">
<!--
var tabChk = new Array();
 
function initListChk()
{
  //list des input dans la page
  //var listInput = document.getElementsByTagName("input");
 
  //list des input dans un conteneur précis
  var listInput = document.getElementById("conteneur").getElementsByTagName("input");
 
  var n = listInput.length;
  var i, j;
 
  j=0;
  for (i=0; i<n; i++)
  {
   //on ne garde que les checkbox
   if (listInput[i].type.toLowerCase()=="checkbox")
   {
     tabChk[j] = listInput[i];
     j++;
   }
  }
  //alert(tabChk.length);
}
 
function clicChk(obj)
{
 var exp, n, i;
 
 n = tabChk.length;
 
 exp = new RegExp("^"+obj.id,"gi");
 
 for (i=0; i<n; i++)
 {
    if (exp.test(tabChk[i].id) && obj.id!=tabChk[i].id)
    {
      tabChk[i].checked = obj.checked;
    }
    exp.test("");  //Pour Firefox ???
 }
 
 
 
}
 
//-->
</script>
 
</head>
 
<body onload="initListChk()">
 
<div id="conteneur">
  <input type="checkbox" id="idchk1" onclick="clicChk(this)" />Checkbox 1<br />
  <input class="marge" type="checkbox" id="idchk1.1" />Checkbox 1.1<br />
  <input class="marge" type="checkbox" id="idchk1.2" />Checkbox 1.2<br />
 
  <input class="marge" type="checkbox" id="idchk1.3" onclick="clicChk(this)" />Checkbox 1.3<br />
  <input class="marge2" type="checkbox" id="idchk1.3.1" />Checkbox 1.3.1<br />
  <input class="marge2" type="checkbox" id="idchk1.3.2" />Checkbox 1.3.2<br />
  <input class="marge2" type="checkbox" id="idchk1.3.3" />Checkbox 1.3.3<br />
  <input class="marge2" type="checkbox" id="idchk1.3.4" />Checkbox 1.3.4<br />
 
  <input class="marge" type="checkbox" id="idchk1.4" />Checkbox 1.4<br />
 
  <br />
  <input type="checkbox" id="idchk2" onclick="clicChk(this)" />Checkbox 2<br />
  <input class="marge" type="checkbox" id="idchk2.1" />Checkbox 2.1<br />
  <input class="marge" type="checkbox" id="idchk2.2" />Checkbox 2.2<br />
  <input class="marge" type="checkbox" id="idchk2.3" />Checkbox 2.3<br />
</div>
 
</body>
 
</html>

Remarque :
Il y a dans la fonction clicChk une curiosit� :

Code javascript :

S�lectionner tout - Visualiser dans une fen�tre � part

1
2
3
4
5
6
7
8
9
 for (i=0; i<n; i++)
 {
    if (exp.test(tabChk[i].id) && obj.id!=tabChk[i].id)
    {
      tabChk[i].checked = obj.checked;
    }
    exp.test("");  //Pour Firefox ???
 }

Ce qui se passe : si je ne rajoute pas cette ligne (qui, � premi�re vue est inutile), sous Firefox le test ne fonctionne qu'une fois sur deux et donc une checkbox sur 2 est coch�e.
Si quelqu'un peut m'expliquer pourquoi, je lui en serais reconnaissant. Est-ce une erreur dans mon code ?

[edit]
Dans le tutoriel de Jacques Guizol, j'ai cette explication :

Envoy� par Jacques Guizol

La m�thode test(<cha�ne>) (bugg� sous I.E.)

Cette m�thode essaie d'op�rer un appariement entre l'expression r�guli�re r�f�renc�e et la cha�ne de caract�res donn�e en param�tre � partir de l'indice sp�cifi� par la propri�t� lastIndex. Si un appariement est possible, lastIndex est r�actualis� et la valeur bool�enne renvoy�e est true. Dans le cas contraire, la valeur renvoy�e est false et lastIndex est remis � 0.

donc a priori faire un exp.test("") r�initialiserait le test de l'expression r�guli�re, ou plus pr�cis�ment la valeur contenue dans lastIndex (propri�t� non impl�ment� sous IE).

[/edit]

imbrication de checkbox

JavaScript

Vue hybride

Discussions similaires

Partager

Partager