[Résolu] JQUERY - Ajouter une classe par rapport à une checkbox

Bonjour à tous
J'ai actuellement un tableau HTML, avec des checbox pour chaque <th>. Le but étant de masquer à l'impression les colonnes cochées.
Pour ce faire, j'ai créé une classe .th_cb dans ma feuille de style "impression" et j'ai mis comme valeur display: none.
Côté JQUERY, j'essaye d'attribuer la classe .th_cb au <th> dont la checbox est côché. Mais bien sûr, cela ne marche pas

<th>
     <input type="checkbox" class="cb"/> Commune
</th>
<th>
     <input type="checkbox" class="cb"/> PF
</th>
<th>
     <input type="checkbox" class="cb"/> Zonage
</th>

$('.cb').each(function() {
	var cb = $(this).attr();
	if(cb == 'checked') {
		$(this).parent().addClass('th_cb');
	}
	else {
		$(this).parent().removeClass('th_cb');
	}
});

.th_cb {
     display: none;
}

Modifié par zombibiot (03 Oct 2017 - 10:54)

Salut

un petit tour dans la doc -> https://api.jquery.com/checked-selector/

cela devrait t'aider

Je doute que this < th fonctionne.

Avec jquery tu as .parent().

Oui, effectivement cela ne fonctionne pas xD
Du coup, j'ai mis à jour le code mais j'ai l'impression que ma condition ne marche pas

$('.cb').each(function() {
	var cb = $(this).attr();
	if(cb == 'checked') {
		$('this').parent().addClass('th_cb');
	}
	else {
		$('this').parent().removeClass('th_cb');
	}
});

Oups, petite modification:

$('.cb').each(function() {
	var cb = $(this).attr();
	if(cb == 'checked') {
		$(this).parent().addClass('th_cb');
	}
	else {
		$(this).parent().removeClass('th_cb');
	}
});

Mais bien sur, ça ne marche toujours pas !

	var cb = $(this).attr();

En même temps cb vaut tout le temps null.

if ($(this).prop('checked')) {

me paraît plus judicieux.

J'ai testé ta condition kustolovic mais ça ne marche toujours pas

Il doit manquer du code, car actuellement il n'y a aucun événement qui déclenche ce bout de code.
Hormis le chargement du JS.
Modifié par Oken (03 Oct 2017 - 11:45)

la fonction .each ne permet pas de balayer le code tous le temps ?

Non.

.each() va appliquer la function à tous ses éléments. Mais il faut un événement pour le déclencher.
Avec le code que tu nous a présenté, il n'y en a pas. Sauf celui du chargement initial de ce code (chargement du JS).

Tu peux remplacer .each() par .on(), qui lui va ajouter un événement à tes checkbox.

Par contre ta condition else ne servira a rien.
Modifié par Oken (03 Oct 2017 - 12:09)

C'est bon Oken ! Effectivement, il manquait un déclencheur
Voici mon code:

$('.cb').each(function(){
	$(this).click(function(){
		if($(this).prop('checked')){
			$(this).parent().addClass('th_cb');
		}
		else{
			$(this).parent().removeClass('th_cb');
		}
	});
});

Un grand merci à tous pour votre aide
Sujet résolu !

Petite rectification, comme le disait plus haut Oken, pas besoin du .each

$('.cb').click(function(){
	if($(this).prop('checked')){
		$(this).parent().addClass('th_cb');
	}
	else{
		$(this).parent().removeClass('th_cb');
	}
});