Discussion :

[flashnet]

Bonjour,

J'ai une arborescence en liste et j'aimerais cocher les éléments enfants lorsque le père est coché. Mon code HTML se présente actuellement sous la forme suivante :

J'ai tenté de faire le code JS mais il me manque des éléments pour aboutir... Je ne pense pas que children soit bien adapté dans mon cas, mais comment faire ? Merci.

Code :

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

1
2
3
4
5
6
 
$('.aco_master').click(function(){ 
    	if($('.aco_master').attr('checked') == 'checked'){
    	  $('.aco_child').children.attr("checked", "checked");
    	}
    });

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
24
25
<ul id="navigation" class="treeview">
<li class="expandable">
<div class="hitarea expandable-hitarea"></div>
<input id="AcoId73" class="aco_master" type="checkbox" value="73" name="data[Aco][id][73]">
Ajax
<ul>
<li>
<input id="AcoId74" class="aco_child" type="checkbox" value="74" name="data[Aco][id][74]">
_index
</li>
<li>
<input id="AcoId75" class="aco_child" type="checkbox" value="75" name="data[Aco][id][75]">
_edit_utilisateur
</li>
<li>
<input id="AcoId76" class="aco_child" type="checkbox" value="76" name="data[Aco][id][76]">
_list_utilisateurs
</li>
<li>
<input id="AcoId77" class="aco_child" type="checkbox" value="77" name="data[Aco][id][77]">
_save_utilisateur
</li>
</ul>
<li class=..>Blabla
<ul>...

[danielhagnoul]

Bonsoir

Voir : http://api.jquery.com/prop/

Code :

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

1
2
3
4
5
$('.aco_master').change(function(){
	if ( $(this).prop('checked') ){
		$('.aco_child').prop("checked", true);
	}
});

[Bovino]

Tu commets pas mal de confusions...

Code :

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

$('.aco_child').children.attr("checked", "checked");

C'est quoi pour toi un enfant d'une balise <input>, qui par définition n'a pas de contenu ?

Code :

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

if($('.aco_master').attr('checked') == 'checked')

C'est lequel d'input que tu vérifies selon toi ?
D'autre part, .attr() vérifie la valeur de l'attribut, pour vérifier si un input est coché, c'est plutôt

Code :

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

$('.aco_master:checked')

ou

Code :

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

$('.aco_master').is(':checked')

[flashnet]

Merci pour vos réponses, voici ce que je suis arrivé à faire et qui fonctionne :

Code :

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

1
2
3
4
5
6
7
8
 
$('[class*="aco_master"]').change(function(){
        var aco_child_id = $(this).attr('class').substr(-1,1);
    	if ( $(this).prop('checked') ){
    		$('.aco_child_'+aco_child_id).prop("checked", true);
    	} else {
    		$('.aco_child_'+aco_child_id).prop("checked", false);
}

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<ul>
<li>
<input id="AcoId73" class="aco_master_1" type="checkbox" value="73" name="data[Aco][id][73]">
Ajax
<ul>
<li>
<input id="AcoId74" class="aco_child_1" type="checkbox" value="74" name="data[Aco][id][74]">
index
</li>
<li>
<input id="AcoId75" class="aco_child_1" type="checkbox" value="75" name="data[Aco][id][75]">
editutilisateur
</li>
<ul class="aco_master_2">...