Walid Omonos Walid Omonos - 3 months ago 9
jQuery Question

How to check if all of the checkbox are checked

How can I check if all of my checkboxes are checked or unchecked with jquery,I have child and grandchild input elements-

codepen setup : http://codepen.io/Assert/pen/BLBjpk

<ul id="treeList">
<li>
<input type="checkbox" name="selectedRole"> mCRC
<ul>
<li>
<input type="checkbox" name="selectedRole"> STIVARGA Efficacy
<ul>
<li>
<input type="checkbox" name="selectedRole"> Long-Term Responders
</li>
<li>
<input type="checkbox" name="selectedRole"> STIVARGA in Clinical Practice
</li>
</ul>
</li>
<li>
<input type="checkbox" name="selectedRole"> STIVARGA AE Management
</li>

<li>
<input type="checkbox" name="selectedRole"> Dosing
</li>
<li>
<input type="checkbox" name="selectedRole"> Patient Communication
</li>
<li>
<input type="checkbox" name="selectedRole"> Case Studies
</li>
</ul>

<li>
<input type="checkbox" name="selectedRole"> GIST
</li>



Answer

Use :checkbox to get all checkbox then use the combination of :not() and :checked to filter out all unchecked checkbox.

if($('#treelist :checkbox:not(:checked)').length == 0){ 
   // all are checked
} else if($('#treelist :checkbox:checked').length == 0){
   // all are unchecked
}