Discussion :

[crazyyann]

Bonjour à tous,

ci dessous le code me permettant de cocher/decocher des checkbox en cliquant sur la cellule du tableau dans laquelle se trouve cette case à cocher.

Code :

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

1
2
3
4
5
6
7
8
$('.CellHover').on('click', function (){ //Evenement : executé au clique sur une cellule du tableau contenant une checkbox
	var cbPresence=this.lastChild.id; //Recuperation de l'id de la checkbox
	if($('#'+cbPresence).is(':checked')){
		$('#'+cbPresence).prop('checked', false);
	}else{
		$('#'+cbPresence).prop('checked', true);
	}
});

Si je clique sur la cellule du tableau la checkbox se coche/dechoche bien, en revanche en cliquant directement sur la checkbox, rien ne se passe, elle ne change pas d'état.

Quelqu'un a une idée?

Merci.

[Bovino]

elle ne change pas d'état

Si, elle change d'état.
Sauf que quand tu cliques sur la case à cocher, elle change d'état, puis l'événement clic se propage et atteint la cellule du tableau et déclenche le code associé et elle rechange d'état.
Bref, ça revient à cliquer deux fois dessus !
Il faut donc éviter ce double changement d'état par exemple en vérifiant quel élément a reçu l'événement :

http://codepen.io/bovino/pen/IuoHG

Ensuite, ton code est un peu pataud.

Code :

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

var cbPresence=this.lastChild.id; //Recuperation de l'id de la checkbox

Certes, tu récupères l'id de la checkbox, mais à partir de la checkbox elle-même.

Code :

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

var cbPresence=$(this.lastChild);

serait peut-être plus adapté, voire

Code :

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

var cbPresence=$(this).find(':checkbox');

[crazyyann]

Parfait.

Merci pour le coup de main.

Bonne journée.