Discussion :

[chrislcf]

Bonjour � tous,

J'ai un petit souci sur une fonction JavaScript qui doit me permettre de cocher plusieurs checkbox lorsque je coche la checkbox "m�re".

Je mets le Datagrid concern� en pi�ce jointe. J'ai donc bien une colonne de checkbox avec une checkbox dans le header. Ce que je veux c'est que lorsque je coche la checkbox dans le header toutes les autres checkbox se cochent et inversement.

Apr�s plusieurs recherches j'ai fait le code suivant :

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
function CheckAllDataGridCheckBoxes()
        {
 
 
//list des input dans un conteneur précis
var listInput = document.getElementById("dgdListeFicheMensuelle").getElementsByTagName("input");
var n = listInput.length;
var i, j;
 
j=0;
 
var cbx = document.getElementById('CheckAll');
         if (cbx.checked)
                {
 
 
		for (i=0; i<n; i++)
			{
			//on ne garde que les checkbox
		             if (listInput[i].type.toLowerCase()=="checkbox")
				{
			            listInput[i].checked = 'true';
				    j++;
				}
			}
                 }
 
        }

Au niveau de mon code HTML j'ai la chose suivante:

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
 
<asp:datagrid id="dgdListeFicheMensuelle" runat="server" Width="825px" AutoGenerateColumns="False" AllowSorting="True">
 
.........(tout le début de mon datagrid)...........
 
Dernière colonne:
 
<asp:TemplateColumn SortExpression="Generation" HeaderText="&nbsp&nbspEffectuer Génération&nbsp&nbsp">
<ItemStyle Wrap="False" HorizontalAlign="Center"></ItemStyle>
<headertemplate>
											<asp:checkbox id="CheckAll"  runat="server" text="Tout Sélectionner" onclick=CheckAllDataGridCheckBoxes()></asp:checkbox>
										</headertemplate>
 
<ItemTemplate>										
											<asp:checkbox id="Check" runat="server" Align = "center">
											</asp:checkbox>
</ItemTemplate>
</asp:TemplateColumn>
 
 
 
</Columns>
</asp:datagrid></DIV>

Je ne vois ce que j'ai de faux. De plus je ne sais pas trop comment debugger du Javascript. Merci de votre aide.

[Bovino]

Code :

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

listInput[i].checked = 'true';

A remplacer par :

Code :

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

listInput[i].checked = true;

checked est un bool�en, pas une chaine...

[chrislcf]

Ok j'ai modifi�.

Ca ne marche toujours pas.

J'ai une erreur Javascript lorsque je coche la checkbox "m�re" qui me dit :

"Ligne 40(correspond � ma premi�re ligne de ma fonction) Objet Requis"

[Bovino]

Code :

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

onclick=CheckAllDataGridCheckBoxes()

Non, rat�...

Code :

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

onclick="CheckAllDataGridCheckBoxes()"

[chrislcf]

Ok c'est bon cela fonctionne nikel maintnant. En fait j'ai regard� mon code source et l'id "checkall" �tait chang� en "dgdListeFicheMensuelle__ctl1_CheckAll".

Voici ma fonction :

[chrislcf]

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
function CheckAllDataGridCheckBoxes()
        {                   
				//list des input dans un conteneur précis
				var listInput = document.Form1.document.getElementById("dgdListeFicheMensuelle").getElementsByTagName("input");
				var n = listInput.length;
				var i;
 
 
                if (document.getElementById('dgdListeFicheMensuelle__ctl1_CheckAll').checked = true)
                {
					//alert('ca passe');
 
					for (i=0; i<n; i++)
						{
							//on ne garde que les checkbox
							if (listInput[i].type.toLowerCase()=="checkbox")
								{
									//alert('ca passe');
									listInput[i].checked = true;
 
								}
						}
 
                }
 
 
 
 
        }

[chrislcf]

Par contre comment faire pour optimiser ma fonction :
1) Lorsque je d�coche la case "m�re" tout se d�coche
2)lorsque je d�coche une des checkbox la case "m�re" se d�coche

Pour le 1) j'ai tent� de rajouter un if :

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
if (document.getElementById('dgdListeFicheMensuelle__ctl1_CheckAll').checked = false)
                {
					//alert('ca passe');
 
					for (i=0; i<n; i++)
						{
							//on ne garde que les checkbox
							if (listInput[i].type.toLowerCase()=="checkbox")
								{
									//alert('ca passe');
									listInput[i].checked = false;
 
								}
						}
 
                }

Ceci ne fonctionne pas tr�s bien.

En effet, lorsque je coche la case "m�re" toutes les checkbox se cochent mais la case "m�re" reste d�coch�e. Je peux cliquer dessus 15 fois cela ne changera rien.

???

[chrislcf]

Probl�me R�solu.

Voici mon code :

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
62
63
64
65
66
67
68
69
function CheckAllDataGridCheckBoxes()
        {                   
				//list des input dans un conteneur précis
				var listInput = document.Form1.document.getElementById("dgdListeFicheMensuelle").getElementsByTagName("input");
				var n = listInput.length;
				var i;
 
 
                if (document.getElementById('dgdListeFicheMensuelle__ctl1_CheckAll').checked == true)
                {
					//alert('ca passe');
 
					for (i=0; i<n; i++)
						{
							//on ne garde que les checkbox
							if (listInput[i].type.toLowerCase()=="checkbox")
								{
									//alert('ca passe');
									listInput[i].checked = true;
 
								}
						}
 
                }
 
                if (document.getElementById('dgdListeFicheMensuelle__ctl1_CheckAll').checked == false)
                {
					//alert('ca passe');
 
					for (i=0; i<n; i++)
						{
							//on ne garde que les checkbox
							if (listInput[i].type.toLowerCase()=="checkbox")
								{
									//alert('ca passe');
									listInput[i].checked = false;
 
								}
						}
 
                }               
 
        }
 
        function DecocherCheckAll()
        {
			//list des input dans un conteneur précis
 
				var i;
				var debut_id = "dgdListeFicheMensuelle__ctl";
				var fin_id = "_Check";
				var listInput = document.Form1.document.getElementById("dgdListeFicheMensuelle").getElementsByTagName("input");
				var n = listInput.length;
 
				for (i=1; i<n; i++)
						{
							//on ne garde que les checkbox
 
									if (listInput[i].type.toLowerCase()=="checkbox")
									{
									if (listInput[i].checked == false)
									document.getElementById('dgdListeFicheMensuelle__ctl1_CheckAll').checked = false;
									}
 
 
						}
 
 
        }