Petit script tout cocher - tout décocher

Version imprimable

Bonjour,
N'étant pas doué en javascript, j'essaie d'adapter des scripts trouvés sur le web.
Je voudrais faire fonctionner un pour cocher / décocher / inverser la sélection, je ne trouve pas l'erreur : (script sans doute de Eric Marcus en 2006, probablement modifié)

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<script type="text/javascript">
<!--
// a_faire = '0' pour tout decocher 
// a_faire = '1' pour tout cocher 
// a_faire = '2' pour inverser la selection 
function GereChkbox(conteneur, a_faire) {
var blnEtat=null;
var Chckboxes = document.getElementById(conteneur).getElementsByTagName('input');
  for(var i=0;i<Chckboxes.length;i++) {
    var Chckbox = Chckboxes[i];
    if (Chckbox.nodeName=="INPUT") {
      if (Chckbox.getAttribute("type")=="checkbox") {
        blnEtat = (a_faire=='0') ? false : (a_faire=='1') ? true : (Chckbox.checked) ? false : true;
        Chckbox.checked=blnEtat;
      }
    }
  }
}
-->
</script>

Avant mon tableau :

Code:

1
2
3
4
5
6
<form method="post" enctype="multipart/form-data" action="rap.saisie.exec.php"  name="select_lignes">
 
<input type="button" value="Tout cocher" onClick="GereChkbox('div_chck','1');">&nbsp;&nbsp;&nbsp;
<input type="button" value="Tout d&eacute;cocher" onClick="GereChkbox('div_chck','0');">&nbsp;&nbsp;&nbsp;
<input type="button" value="Inverser la s&eacute;lection" onClick="GereChkbox('div_chck','2');">
<div id="div_chck">

Dans mon tableau : (généré en php)

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
...
<tr>
	  <td><input type="checkbox" name="ligne%248817" id="ligne%248817" value="1"><label for="ligne%248817"> . </label></td>
</tr>
<tr>
	  <td><input type="checkbox" name="ligne%248827" id="ligne%248827" value="2"><label for="ligne%248827"> . </label></td>
</tr>
...
</table>
<br /><br />
<center><input border="0" name="select_lignes"  src="../images/btn_valider.gif" type="image" value="submit" width="93" height="22" alt="Affecter"></center>
 
</div>
</form>

Qu'est-ce qui ne va pas ?
Merci

j'ai un peut modifie le script

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<button id="checkAll">Tout cocher</button>
<button id="uncheckAll">Tout d&eacute;cocher</button>
<button id="invertAllCheck">Inverser la s&eacute;lection</button>
 
<div id="div_chck">
    <table>
        <tr>
          <td><input type="checkbox" name="ligne%248817" id="ligne%248817" value="1"><label for="ligne%248817"> . </label></td>
        </tr>
        <tr>
          <td><input type="checkbox" name="ligne%248827" id="ligne%248827" value="2"><label for="ligne%248827"> . </label></td>
        </tr>
    </table>
</div>

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
document.getElementById('checkAll').addEventListener('click', () => {
    checkAll('div_chck');
});
document.getElementById('uncheckAll').addEventListener('click', () => {
    uncheckAll('div_chck');
});
document.getElementById('invertAllCheck').addEventListener('click', () => {
    invertAllCheck('div_chck');
});
function checkAll(targetId) {
    GereChkbox(targetId, 1);
}
function uncheckAll(targetId) {
    GereChkbox(targetId, 0);
}
function invertAllCheck(targetId) {
    GereChkbox(targetId, 2);
}
function GereChkbox(conteneur, action) {
    document.querySelectorAll(`#${conteneur} input`).forEach(input => {
        if(action === 1) {
            input.checked = true;
        } else if (action === 0) {
            input.checked = false;
        } else {
            input.checked = !input.checked;
        }
    });
}

j'ai cree 3 functions intermediaires pour plus de clarete

27/08/2020, 18h01
arcane

J'ai intégré ce code, les 3 boutons font office de validation de formulaire, mais sans rien faire au niveau des checkbox.
Du coup j'ai déplacé ma ligne <form> juste après les boutons, les boutons ne valident pas mon formulaire mais ils n'ont aucun effet sur les checkbox.
Il faudrait nommer les <button> autrement ? (pour qu'ils ne valident pas le formulaire)

Merci
28/08/2020, 07h08
Doksuri

les <forms> c'est pour des donnees destines a des formulaires (qu'on envoit au serveur lors de la validation)
si tu n'envois pas les donnees au serveur, ca ne sert a rien de les mettre dans un <form>
theoriquement, c'est un <input type="submit"> qui "valide & envoie" le formulaire, c'est pour ca que j'ai mis des <button>

as-tu place le JS a la fin de ton html ?
as-tu des erreurs dans la console ?

Bonjour,
J'ai bien un form pour envoyer les données (justement les cases checkbox cochées)
Par contre je mets le script dans l'entête de page html :

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
<!DOCTYPE HTML>
 
<html lang="fr">
 
<head>
<title>rapp</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta name="generator" content="Notepad++">
<link rel="stylesheet" type="text/css" href="../styles/feuille_style.css">
<link rel="stylesheet" type="text/css" href="../styles/feuille_style_bloc.css">
<script type="text/javascript">
<!--
document.getElementById('checkAll').addEventListener('click', () => {
    checkAll('div_chck');
});
document.getElementById('uncheckAll').addEventListener('click', () => {
    uncheckAll('div_chck');
});
document.getElementById('invertAllCheck').addEventListener('click', () => {
    invertAllCheck('div_chck');
});
function checkAll(targetId) {
    GereChkbox(targetId, 1);
}
function uncheckAll(targetId) {
    GereChkbox(targetId, 0);
}
function invertAllCheck(targetId) {
    GereChkbox(targetId, 2);
}
function GereChkbox(conteneur, action) {
    document.querySelectorAll(`#${conteneur} input`).forEach(input => {
        if(action === 1) {
            input.checked = true;
        } else if (action === 0) {
            input.checked = false;
        } else {
            input.checked = !input.checked;
        }
    });
}
-->
</script>
 
</head>

Ensuite j'ai un premier tableau indépendant, puis mon formulaire dans lequel je veux cocher certaines lignes, toutes ou aucune pour les envoyer via le formulaire.

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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<font class="titreajoutmodif">BL :</font>&nbsp;&nbsp;<br /><br />
&nbsp;&nbsp;&nbsp;<button id="checkAll">Tout cocher</button>
<button id="uncheckAll">Tout d&eacute;cocher</button>
<button id="invertAllCheck">Inverser la s&eacute;lection</button>
<form method="post" enctype="multipart/form-data" action="rap.saisie.exec.php"  name="select_lignes">
   <input type="hidden" name="rap_lot_id" value="2512">
 
<div id="div_chck">
<br />
</center>
<table border="1" align="center">
<tr>
      <td> </td>
      <td>Date</td>
	  <td>Code </td>
	  <td>Nom</td>
	  <td>Code2</td>
	  <td>Nom2</td>
	  <td>Nom3</td>
	  <td>Produit</td>
	  <td>Lib produit</td>
	  <td>Qte unite vente</td>
	  <td>Code unit&eacute; vente</td>
	  <td>Prix net unitaire</td>
	  <td>S</td>
	  <td>No bon</td>
	  <td>No facture</td>
</tr>
 
	<tr>
	  <td><input type="checkbox" name="ligne%256878" id="ligne%256878" value="1"><label for="ligne%256878"> . </label></td>
	  <td>2020-03-03</td>
	  <td>102507</td>
	  <td>xxxxxx</td>
	  <td>102507</td>
	  <td>xxxxxx</td>
	  <td>xxxxxx</td>
	  <td>xxxxxx</td>
	  <td>xxxxxx</td>
	  <td>xxxxxx</td>
	  <td>xxxxxx</td>
	  <td>xxxxxx</td>
	  <td>xxxxxx</td>
	  <td>62395</td>
	  <td>0</td>
	</tr>
 
	<tr>
	  <td><input type="checkbox" name="ligne%256880" id="ligne%256880" value="2"><label for="ligne%256880"> . </label></td>
	  <td>2020-03-03</td>
	  <td>102507</td>
	  <td>xxxxxx</td>
	  <td>102507</td>
	  <td>xxxxxx</td>
	  <td>xxxxxx</td>
	  <td>xxxxxx</td>
	  <td>xxxxxx</td>
	  <td>xxxxxx</td>
	  <td>xxxxxx</td>
	  <td>xxxxxx</td>
	  <td>xxxxxx</td>
	  <td>62395</td>
	  <td>0</td>
	</tr>
	.....
 
	</table>
<br /><br />
<center><input border="0" name="select_lignes"  src="../images/btn_valider.gif" type="submit"  width="93" height="22" alt="Affecter"></center>
 
</div>
</form>
 
<br /><br />
<center>
<a href="index.php">Retour</a>
<br /><br />
</center>
 
</body>
 
</html>

J'ai testé de mettre le script à la fin du fichier html mais cela ne change rien. Je n'arrive toujours pas à utiliser les boutons

Sinon, j'ai effectivement une erreur dans la console (que je viens de découvrir !)

Citation:

Uncaught TypeError: Cannot read property 'addEventListener' of null
at rap.saisie2.php:14

merci

28/08/2020, 11h31
arcane

A priori l'erreur viendrait du fait qu'il faut mettre le script dans le body et non le head.
Ce que j'ai fait. Mais j'ai toujours l'erreur.

si ton JS est en haut de page, il faut que tu encapsule les listeners que je t'ai fournis par un domcontentloaded

Code:

1
2
3
4
5
6
7
8
9
10
11
document.addEventListener('DOMContentLoaded', () {
document.getElementById('checkAll').addEventListener('click', () => {
    checkAll('div_chck');
});
document.getElementById('uncheckAll').addEventListener('click', () => {
    uncheckAll('div_chck');
});
document.getElementById('invertAllCheck').addEventListener('click', () => {
    invertAllCheck('div_chck');
});
});

30/08/2020, 17h25
javatwister

Le code de Doksuri fonctionne sans problème même sans ajouter un listener sur document; (ce qui est logique)

Merci de vos réponses. Je reviens sur ce script, je n'y arrive toujours pas.
J'ai testé :
En entête (<head>) : je ne mets rien de particulier.
Dans le corps de la page :

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
<button id="checkAll">Tout cocher</button>
<button id="uncheckAll">Tout d&eacute;cocher</button>
<button id="invertAllCheck">Inverser la s&eacute;lection</button>
<form method="post" enctype="multipart/form-data" action="rap.saisie.exec.php"  name="select_lignes">
<div id="div_chck">
...
<td><input type="checkbox" name="ligne%252694" id="ligne%252694" value="1"><label for="ligne%252694"> . </label></td>
...
<td><input type="checkbox" name="ligne%253469" id="ligne%253469" value="2"><label for="ligne%253469"> . </label></td>
...
<input border="0" name="select_lignes"  src="../images/btn_valider.gif" type="submit"  width="93" height="22" alt="Affecter"></center>
 
</div>
</form>
<script type="text/javascript">
<!--
document.getElementById('checkAll').addEventListener('click', () => {
    checkAll('div_chck');
});
document.getElementById('uncheckAll').addEventListener('click', () => {
    uncheckAll('div_chck');
});
document.getElementById('invertAllCheck').addEventListener('click', () => {
    invertAllCheck('div_chck');
});
function checkAll(targetId) {
    GereChkbox(targetId, 1);
}
function uncheckAll(targetId) {
    GereChkbox(targetId, 0);
}
function invertAllCheck(targetId) {
    GereChkbox(targetId, 2);
}
function GereChkbox(conteneur, action) {
    document.querySelectorAll(`#${conteneur} input`).forEach(input => {
        if(action === 1) {
            input.checked = true;
        } else if (action === 0) {
            input.checked = false;
        } else {
            input.checked = !input.checked;
        }
    });
}
-->
</script>
</body>
</html>

Note : je n'ai pas d'erreur dans la console avec cette page.

J'essaye l'autre solution : mettre le script dans le head

Si je mets le script dans le head:

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
<head>
<title>...</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta name="generator" content="HAPedit 3.1">
<link rel="stylesheet" type="text/css" href="../styles/feuille_style.css">
<link rel="stylesheet" type="text/css" href="../styles/feuille_style_bloc.css">
 
<script type="text/javascript">
<!--
document.addEventListener('DOMContentLoaded', () {
document.getElementById('checkAll').addEventListener('click', () => {
    checkAll('div_chck');
});
document.getElementById('uncheckAll').addEventListener('click', () => {
    uncheckAll('div_chck');
});
document.getElementById('invertAllCheck').addEventListener('click', () => {
    invertAllCheck('div_chck');
});
function checkAll(targetId) {
    GereChkbox(targetId, 1);
};
function uncheckAll(targetId) {
    GereChkbox(targetId, 0);
};
function invertAllCheck(targetId) {
    GereChkbox(targetId, 2);
};
function GereChkbox(conteneur, action) {
    document.querySelectorAll(`#${conteneur} input`).forEach(input => {
        if(action === 1) {
            input.checked = true;
        } else if (action === 0) {
            input.checked = false;
        } else {
            input.checked = !input.checked;
        }
    });
};
};
-->
</script>
</head>
<body>
...
<button id="checkAll">Tout cocher</button>
<button id="uncheckAll">Tout d&eacute;cocher</button>
<button id="invertAllCheck">Inverser la s&eacute;lection</button>
<form method="post" enctype="multipart/form-data" action="rap.saisie.exec.php"  name="select_lignes">
<div id="div_chck">
...
<td><input type="checkbox" name="ligne%252694" id="ligne%252694" value="1"><label for="ligne%252694"> . </label></td>
...
<td><input type="checkbox" name="ligne%253469" id="ligne%253469" value="2"><label for="ligne%253469"> . </label></td>
...
<input border="0" name="select_lignes"  src="../images/btn_valider.gif" type="submit"  width="93" height="22" alt="Affecter"></center>
 
</div>
</form>
...

Cela ne fonctionne pas non plus.
J'ai une erreur dans la console : Uncaught SyntaxError : Unexpected token ')', ligne 15.
Ligne 15 dans le source html =

Code:

document.addEventListener('DOMContentLoaded', () {

J'ai testé de mettre les fonctions entre () mais j'ai une erreur identique ligne 16 avec un .
Ligne 16 =

Code:

document.getElementById('checkAll').addEventListener('click', () => {

Je continue d'autres tests. Mais je suis preneur de vos idées.

Merci

07/09/2020, 16h43
javatwister

Code:

document.addEventListener('DOMContentLoaded', () => {

dernière ligne du script:
)};
et non
};
(tu as ouvert un listener avec une parenthèse: il faut la refermer...)
07/09/2020, 17h56
arcane

Je tourne en rond : j'ai bien ajouté une parenthèse à la fin : }); plutôt que )}; pour ne pas avoir d'erreur de syntaxe.
Mais mon script ne fonctionne toujours pas, les boutons me valident le formulaire.
Du coup je mets ma ligne form juste après les boutons, les boutons ne valident plus le formulaire mais ils ne font rien.
Je dois avoir autre chose dans ma page qui bloque. Quels seraient les instructions à vérifier ? (compatibilité avec javascript, restrictions, ...)
Merci
08/09/2020, 09h01
Doksuri

tu peux nous montrer le html complet ?

ps :  ce sont des commentaires html et non js

Je sais que <!-- c'est un commentaire html. Je ne sais pas ce que ça fait pour javascript. Il faut en mettre ou non ? J'ai testé de les enlever, cela ne change rien.

Voici le script html complet (j'ai enlevé des lignes de tableau, ce sont toutes les mêmes)
J'ai testé directement en html pour voir, il ne fonctionne pas (ce qui est cohérent avec mon php)

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
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
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
<!DOCTYPE HTML>
 
<html lang="fr">
 
<head>
<title>Titre</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta name="generator" content="Notepad++">
<link rel="stylesheet" type="text/css" href="../styles/feuille_style.css">
<link rel="stylesheet" type="text/css" href="../styles/feuille_style_bloc.css">
 
<script type="text/javascript">
 
document.addEventListener('DOMContentLoaded', () => {
document.getElementById('checkAll').addEventListener('click', () => {
    checkAll('div_chck');
});
document.getElementById('uncheckAll').addEventListener('click', () => {
    uncheckAll('div_chck');
});
document.getElementById('invertAllCheck').addEventListener('click', () => {
    invertAllCheck('div_chck');
});
function checkAll(targetId) {
    GereChkbox(targetId, 1);
};
function uncheckAll(targetId) {
    GereChkbox(targetId, 0);
};
function invertAllCheck(targetId) {
    GereChkbox(targetId, 2);
};
function GereChkbox(conteneur, action) {
    document.querySelectorAll(`#${conteneur} input`).forEach(input => {
        if(action === 1) {
            input.checked = true;
        } else if (action === 0) {
            input.checked = false;
        } else {
            input.checked = !input.checked;
        }
    });
};
});
 
</script>
 
 
</head>
 
<body>
 
 
<br />
<br />
 
<font class="titrepage">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<u>Rap</u>
</font>
<br /><br /><br />
 
<center>
&nbsp;&nbsp;&nbsp;<font class="titreajoutmodif">Typ Page :</font>&nbsp;&nbsp;
Texte<br />
  Texte<br />
  Debut : 2020-07-06 - Fin : 0000-00-00
 
<br /><br />
&nbsp;&nbsp;&nbsp;<font class="titreajoutmodif">Com :</font>&nbsp;&nbsp;
</center>
 
<table border="1" align="center">
<tr>
	  <td>Date</td>
	  <td>Type</td>
	  <td>Col3</td>
	  <td>Col4</td>
	  <td>Col5</td>
	  <td>Col6</td>
	  <td>Col7</td>
	  <td>Col8</td>
	  <td>Col9</td>
	  <td>Col10</td>
	  <td>Col11</td>
	  <td>Col12</td>
</tr>
 
	<tr>
	  <td>2020-07-06</td>
	  <td>m</td>
	  <td>M</td>
	  <td>P</td>
	  <td>1</td>
	  <td>T</td>
	  <td>6</td>
	  <td>2</td>
	  <td></td>
	  <td>7</td>
	  <td>3</td>
	  <td>0.018</td>
	</tr>
 
	<tr>
	  <td>2020-07-06</td>
	  <td>m</td>
	  <td>M</td>
	  <td>P</td>
	  <td>3</td>
	  <td>T</td>
	  <td>2</td>
	  <td>2</td>
	  <td></td>
	  <td>7</td>
	  <td>3</td>
	  <td>0.035</td>
	</tr>
 
	<tr>
	  <td>2020-07-06</td>
	  <td>p</td>
	  <td>A</td>
	  <td>G</td>
	  <td>3</td>
	  <td>T</td>
	  <td>1</td>
	  <td>2</td>
	  <td></td>
	  <td>7</td>
	  <td>3</td>
	  <td>3.467</td>
	</tr>
	</table>
 
<br /><br />
<center>
&nbsp;&nbsp;&nbsp;<font class="titreajoutmodif">B:</font>&nbsp;&nbsp;<br /><br />
 
 
&nbsp;&nbsp;&nbsp;<button id="checkAll">Tout cocher</button>
<button id="uncheckAll">Tout d&eacute;cocher</button>
<button id="invertAllCheck">Inverser la s&eacute;lection</button>
<form method="post" enctype="multipart/form-data" action="rap.saisie.exec.php"  name="select_lignes">
 
   <input type="hidden" name="rap_lot_id" value="2538">
 
<div id="div_chck">
<br />
</center>
 
<table border="1" align="center">
<tr>
      <td> </td>
      <td>Date</td>
	  <td>Col2</td>
	  <td>Nol3</td>
	  <td>Col4</td>
	  <td>Col5</td>
	  <td>Col6</td>
	  <td>Col7</td>
	  <td>Col8</td>
	  <td>Col9</td>
	  <td>Col10</td>
	  <td>Col11</td>
	  <td>Col12</td>
	  <td>Col13</td>
	  <td>Col14</td>
	  <td>Col15</td>
</tr>
 
	<tr>
	  <td><input type="checkbox" name="ligne%260241" id="ligne%260241" value="1"><label for="ligne%260241"> . </label></td>
	  <td>2020-03-09</td>
	  <td>1</td>
	  <td>V</td>
	  <td>1</td>
	  <td>G</td>
	  <td>L</td>
	  <td>A</td>
	  <td>F</td>
	  <td> 
	            m<input type="radio" name="blp_type%260241" value="m" /> &nbsp;&nbsp;
	            e<input type="radio" name="blp_type%260241" value="e" /> &nbsp;&nbsp;
				p<input type="radio" name="blp_type%260241" value="p" /> &nbsp;&nbsp;
				a<input type="radio" name="blp_type%260241" value="a" checked/>
	  </td>			
 
	  <td>9.78</td>
	  <td>T</td>
	  <td>245.5</td>
	  <td>2</td>
	  <td>62944</td>
	  <td>31986</td>
	</tr>
 
	<tr>
	  <td><input type="checkbox" name="ligne%271300" id="ligne%271300" value="2"><label for="ligne%271300"> . </label></td>
	  <td>2020-03-27</td>
	  <td>1</td>
	  <td>V</td>
	  <td>1</td>
	  <td>G</td>
	  <td>L</td>
	  <td>A</td>
	  <td>F</td>
	  <td> 
	            m<input type="radio" name="blp_type%271300" value="m" /> &nbsp;&nbsp;
	            e<input type="radio" name="blp_type%271300" value="e" /> &nbsp;&nbsp;
				p<input type="radio" name="blp_type%271300" value="p" /> &nbsp;&nbsp;
				a<input type="radio" name="blp_type%271300" value="a" checked/>
	  </td>			
 
	  <td>4.9</td>
	  <td>T</td>
	  <td>245.1</td>
	  <td>1</td>
	  <td>64504</td>
	  <td>32717</td>
	</tr>
 
	<tr>
	  <td><input type="checkbox" name="ligne%271299" id="ligne%271299" value="3"><label for="ligne%271299"> . </label></td>
	  <td>2020-03-27</td>
	  <td>1</td>
	  <td>V</td>
	  <td>1</td>
	  <td>G</td>
	  <td>L</td>
	  <td>A</td>
	  <td>F</td>
	  <td> 
	            m<input type="radio" name="blp_type%271299" value="m" /> &nbsp;&nbsp;
	            e<input type="radio" name="blp_type%271299" value="e" /> &nbsp;&nbsp;
				p<input type="radio" name="blp_type%271299" value="p" /> &nbsp;&nbsp;
				a<input type="radio" name="blp_type%271299" value="a" checked/>
	  </td>			
 
	  <td>7.86</td>
	  <td>T</td>
	  <td>245.1</td>
	  <td>2</td>
	  <td>64503</td>
	  <td>32717</td>
	</tr>
 
	<tr>
	  <td><input type="checkbox" name="ligne%280604" id="ligne%280604" value="4"><label for="ligne%280604"> . </label></td>
	  <td>2020-04-10</td>
	  <td>1</td>
	  <td>V</td>
	  <td>1</td>
	  <td>G</td>
	  <td>L</td>
	  <td>A</td>
	  <td>F</td>
	  <td> 
	            m<input type="radio" name="blp_type%280604" value="m" /> &nbsp;&nbsp;
	            e<input type="radio" name="blp_type%280604" value="e" /> &nbsp;&nbsp;
				p<input type="radio" name="blp_type%280604" value="p" /> &nbsp;&nbsp;
				a<input type="radio" name="blp_type%280604" value="a" checked/>
	  </td>			
 
	  <td>9.46</td>
	  <td>T</td>
	  <td>255.1</td>
	  <td>2</td>
	  <td>65643</td>
	  <td>33270</td>
	</tr>
	</table>
<br /><br />
<center><!--<input border="0" name="select_lignes"  src="../images/btn_valider.gif" type="submit"  width="93" height="22" alt="Affecter"></center>-->
<input border="0" name="select_lignes"  src="../images/btn_valider.gif" type="image" value="submit" width="93" height="22" alt="Affecter">
 
</div>
</form>
 
 
<br /><br />
<center>
<a href="index.php">Retour</a>
<br /><br />
</center>
 
</body>
 
</html>

En tout cas merci de ta patience !

Et le fait est que ce script fonctionne:

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
document.addEventListener('DOMContentLoaded', () => {
document.getElementById('checkAll').addEventListener('click', () => {
    checkAll('div_chck');
});
document.getElementById('uncheckAll').addEventListener('click', () => {
    uncheckAll('div_chck');
});
document.getElementById('invertAllCheck').addEventListener('click', () => {
    invertAllCheck('div_chck');
});
})
 
function checkAll(targetId) {
    GereChkbox(targetId, 1);
};
function uncheckAll(targetId) {
    GereChkbox(targetId, 0);
};
function invertAllCheck(targetId) {
    GereChkbox(targetId, 2);
};
function GereChkbox(conteneur, action) {
    document.querySelectorAll(`#${conteneur} input`).forEach(input => {
        if(action === 1) {
            input.checked = action;
        } else if (action === 0) {
            input.checked = action;
        } else {
            input.checked = !input.checked;
        }
    });
};

N'écris rien d'autre...

08/09/2020, 12h24
arcane

Non ça ne fonctionne pas. J'ai juste remplacé le script.
08/09/2020, 13h57
Doksuri
j'ai compris ton probleme : dans ton 1er exemple (sur lequel je me suis appuye pour faire le petit script), je pensais que tes checkbox etaient dans ton div "div_chck"
or, dans le dernier code fourni : ton div div_chck est vide, tes checkbox sont dans ton table

=> il te suffit de supprimer l'id du div div_chck et de le mettre sur ton table
Code:

1 2 3 4 5 6 ... <div id="div_chck"> <br /> </center> <table border="1" align="center">
devient :
Code:

1 2 3 4 5 6 ... <div> <br /> </center> <table border="1" align="center" id="div_chck">
08/09/2020, 14h38
arcane

Yes ! c'est bon pour les checkbox !

Par contre, comment ne pas prendre en compte les radio ? Je ne veux pas que les boutons interfèrent ou ne modifient les radio.
Tout cocher active les radio de droite (et peut-être les autres valeurs aussi)
Tout décocher enlève toutes les valeurs des radio
Inverser, je sais pas trop ce qu'il fait.

Merci
08/09/2020, 14h58
Doksuri

tu peux modifier le selecteur dans la function GereChkbox

=> document.querySelectorAll(`#${conteneur} input[type="checkbox"]`).forEach(input => {
08/09/2020, 15h11
arcane

C'est bon ça ! Merci à vous deux