mardi 13 janvier 2015

check all checkboxes of parents jquery doesn't work in bootstrap menu

I'm trying to check all checkboxes by clicking on the parent checkbox but this code doesn't work for ul segment below



<script>
$(function () {
$("input[type='checkbox']").change(function () {
$(this).siblings('ul')
.find("input[type='checkbox']")
.prop("checked", this.checked);

});
});
<script>


and if I use closest instead of siblings it checks all the checkboxes in subs no matter who the parent is.


help me plz;



<nav class="main_navigation navbar navbar-default vertical_nav_enable" role="navigation">




<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">

<li class="dropdown">
<label class="checkbox">
<input type="checkbox"/>
<a href="/cat1" class="dropdown-toggle" data-toggle="dropdown">

Cat1

</a>
</label>


<ul class="dropdown-menu multi-level">



<li class="dropdown-submenu">
<label class="checkbox">
<input type="checkbox"/>

<a class="dropdown-toggle" data-toggle="dropdown" href="/subcat1">
SubCat1</a>
</label>
</li>
<li class="dropdown-submenu">
<label class="checkbox">
<input type="checkbox"/>

<a class="dropdown-toggle" data-toggle="dropdown" href="/subcat2">
SubCat2</a>
</label>
</li>

<li class="dropdown-submenu">
<label class="checkbox">
<input type="checkbox"/>

<a class="dropdown-toggle" data-toggle="dropdown" href="/subcat3">
SubCat3</a>
</label>
</li>



</ul>

</li>
<li class="dropdown">
<label class="checkbox">
<input type="checkbox"/>
<a href="/cat2" class="dropdown-toggle" data-toggle="dropdown">

Cat2

</a>
</label>


<ul class="dropdown-menu multi-level">



<li class="dropdown-submenu">
<label class="checkbox">
<input type="checkbox"/>

<a class="dropdown-toggle" data-toggle="dropdown" href="/subcat4">
SubCat4</a>
</label>
</li>
<li class="dropdown-submenu">
<label class="checkbox">
<input type="checkbox"/>

<a class="dropdown-toggle" data-toggle="dropdown" href="/subcat5">
SubCat5</a>
</label>
</li>

<li class="dropdown-submenu">
<label class="checkbox">
<input type="checkbox"/>

<a class="dropdown-toggle" data-toggle="dropdown" href="/subcat6">
SubCat6</a>
</label>
</li>



</ul>

</li>
</ul>
</div>


</nav>




Aucun commentaire:

Enregistrer un commentaire