I have a treelist
containing multiple levels of checkboxes
and I am trying to get the parent checkbox
to show as 'checked'
when any of children checkboxes
are clicked. For some reason this is not working and it's killing me.
JAVASCRIPT
$(function() {
$("input.boundChild[type=checkbox]").click(function() {
$(this).closest("input.boundParent").prop("checked", "checked");
});
});
HTML
<ul>
<li class="collapsed expanded">
<input id="0" class="boundParent" type="checkbox" >
Australia
<ul style="display: block;">
<li>
<input id="0/" class="boundChild" type="checkbox" checked="">
<input type="hidden" value="Intel Australia PTY Ltd.">
</li>
</ul>
</li>
</ul>
input
elements can't have children, in your markup input.boundParent
is not one of the parents of the input.boundChild
. It's a sibling of the ul
element. you can use prev
method.
$(function() {
$("input.boundChild[type=checkbox]").click(function() {
$(this).closest('ul').prev().prop("checked", this.checked);
// $('input.boundParent').prop("checked", this.checked);
});
});
http://jsfiddle.net/dhVvN/
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With