Discussion :

[Amélie Ladoque]

Bonjour à tous,

J'ai un formulaire avec des cases à cocher dont je voudrais avoir le total des cochées.
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
<script language="javascript">
function compteFerie() {
	var nb = 0;
	nb = document.calendrier.total.value;
	for ( var i = 0; i < document.calendrier.elements.length; i++ )	{
		if ( document.calendrier.elements[ i ].type == 'checkbox' )	{
			if ( document.calendrier.elements[ i ].checked == true ) {
				nb++;
			} else {
				nb--;
			}
		}
	}
	document.calendrier.total.value = nb;
}
</script>
<form action="#" method="POST" name="calendrier">
<p>Total jours chomés : <input type="text" name="total" value="115" size="3" readonly></p>
<p> <INPUT type="checkbox" name="date[]" value="2016-01-01" checked onClick="compteFerie();"> </p>
<p> <INPUT type="checkbox" name="date[]" value="2016-01-02" checked onClick="compteFerie();"> </p>
<p> <INPUT type="checkbox" name="date[]" value="2016-01-03" checked onClick="compteFerie();"> </p>
<p> <INPUT type="checkbox" name="date[]" value="2016-01-04"  onClick="compteFerie();"> </p>
...

Mais mon compteur me renvoie des valeurs négatives.

Merci pour l'aide

[SpaceFrog]

en jquery

Code :

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

$('[name='calendrier'] :checked').length

https://fiddle.jshell.net/d5guvja3/

en js :

Code :

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

 document.querySelectorAll("[name='calendrier'] :checked").length

[Amélie Ladoque]

Merci pour cette 1ere réponse

Mais je n'ai pas compris où je devais insérer/remplacer cette ligne dans mon code.

[SpaceFrog]

Heu ... Là ou tu en as besoin ??

Tout dépend de ce que tu veux faire de cette information et de quand tu en a besoin ? où te sera-t-elle utile ?

[Amélie Ladoque]

Il m'avait semblé avoir été claire :

J'ai un formulaire avec des cases à cocher dont je voudrais avoir le total des cochées.

Si je fais un alert sur la ligne de code que tu me fournie, JS me retourne 0.

[Amélie Ladoque]

Bon, j'ai trouvé.
Il y a une erreur dans la ligne de code fournie.

Code :

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

1
2
3
4
5
function compteFerie() { 
var nb = 0;
nb = document.querySelectorAll('input[type="checkbox"]:checked').length;
document.calendrier.total.value = nb;
}

Tout simplement...

Merci pour la piste

[SpaceFrog]

je ne vois pas d'erreur dans cette ligne :

Code :

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

 document.querySelectorAll("[name='calendrier'] :checked").length

https://fiddle.jshell.net/d5guvja3/1/


le selecteur input[type="checkbox"] est reondant car je en connais pas d'autres éléments du DOM avec un type checkbox

voire même tout ce qui est avant :checked est redondant car il n'y a pas d'autres elements dans ton code pouvant être checked ...

Code :

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

document.querySelectorAll(":checked")

est suffisant ...

[Amélie Ladoque]

Comme je l'ai dit plus haut :

Si je fais un alert sur la ligne de code que tu me fournie, JS me retourne 0.

Testé sous Firefox ESR 38.6.1

Je n'ai pas le temps de tester plus avant mais avec mon code, tout fonctionne.
C'est l'essentiel pour moi.