How does it work?
This code checks/unchecks all checkboxes within the same fieldset. Simple and semantic.
HTML Setup
Add checkboxes however you like, just make sure they are within the same fieldset.
<fieldset>
<!-- these will be affected by check all -->
<div><input type="checkbox" class="checkall"> Check all</div>
<div><input type="checkbox"> Checkbox</div>
<div><input type="checkbox"> Checkbox</div>
<div><input type="checkbox"> Checkbox</div>
</fieldset>
<fieldset>
<!-- these won't be affected by check all; different field set -->
<div><input type="checkbox"> Checkbox</div>
<div><input type="checkbox"> Checkbox</div>
<div><input type="checkbox"> Checkbox</div>
</fieldset>
The "check all" jQuery
I must say this is genius… and fast! I spent a lot of time tweaking this code for performance and brevity. Enjoy!!
Updated: Thanks to comments from k3n and Nate I was able to streamline the original code even more! K3n's code in particular was genius*2.
$(function () {
$('.checkall').click(function () {
$(this).parents('fieldset:eq(0)').find(':checkbox').attr('checked', this.checked);
});
});