[javascript]-Détecter les changements des checkbox

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : [javascript]-Détecter les changements des checkbox

Furaxx

Bonjour,

J'ai un tableau avec une checkbox pour chaque ligne.
Lorsqu'un utilisateur clique dessus j'active ou désactive des fonctionnalités en ajax, pas de souci.

Je souhaite faire une checkbox supplémentaire qui coche ou décoche toutes les cases en même temps, et qui donc déclenche aussi mon autre fonction pour activer/désactiver les fonctionnalités... Et c'est là que ça coince.
Ma checkbox général a bien un effet sur toutes les autres, mais la fonction qui devrait être lancée au moment du changement d'état de chacune ne se lance pas.

Voici mon code:

Fonction lancée lors d'un clic sur le checkbox générale:

Code :

$(document).on('click', 'input[name="check_all"]', function(e) {
if($(this).is(':checked')) {
$('input[name="actif"]').prop('checked', true);
} else {
$('input[name="actif"]').prop('checked', false);
}
});

Fonction lancée lors d'un clic sur une checkbox simple (et qui donc devrait être lancée lors du clic sur la générale):

Code :

$(document).on('change', 'input[name="actif"]', function(e) {
$.ajax({
url : 'L_URL',
type : 'POST',
data : {mes_donnees},
dataType : 'html',
success : function(html) {
// Succès: Aucun retour
},
error : function(resultat){
alert('Erreur : ' + resultat)
}
});

La seconde fonction fonctionne donc très bien lors d'un clic sur une checkbox seule, mais n'est pas activée lors d'un clic sur la générale (mais l'état des checkbox à l'écran change bien lui).

Par avance, merci pour votre aide.

Publicité

mechkurt

trigger('change') https://api.jquery.com/trigger/ ?

Code :

$(document).on('click', 'input[name="check_all"]', function(e) {
if($(this).is(':checked')) {
$('input[name="actif"]').attr('checked', true).trigger('change');
} else {
$('input[name="actif"]').attr('checked', false).trigger('change');
}
});

https://jsfiddle.net/etwhpbyf/

Par contre si on prend mon code html et ta logique de on change : ça déclenchera 3 appel AJAX, que l'on coche ou que l'on décoche, c'est pas top niveau optimisation des ressources... ^^

---------------
D3

Furaxx

Merci beaucoup, je viens de tester et ça fonctionne parfaitement.

J'ai juste ajouté un petit truc à ton code pour que le "change" ne se fasse que sur les éléments dont la coche change réellement (sinon c'est lancé aussi pour ceux qui étaient déjà cochés:

$('input[name="actif"]:not(:checked)').prop('checked', true).trigger('change');

Encore merci!
Je verrai pour optimiser ça en mettant par exemple les ID à changer dans un tableau, puis ne lancer la fonction ajax une seule fois avec ça.

FORUM HardWare.fr

Programmation

Javascript/Node.js

[javascript]-Détecter les changements des checkbox

Sujets relatifs
[Javascript] Désélectionner un choix d'un select	[Javascript] CORS et API calls
Live Search Javascript	Soucis Regex et string.search javascript
Passage de paramètre du PHP au Javascript	[JAVASCRIPT] JSON.parse()
[HTML/CSS][JavaScript] Récupérer un ID sur une autre page Web	Checkbox et VBA
Détecter un changement de valeur dans un input
Plus de sujets relatifs à : [javascript]-Détecter les changements des checkbox

Page générée en 0.078 secondes