Check all Checkboxes with jQuery

I was searching for a solution to this problem and came upon this post. Most Javascript functions that do this rely on the fact that the input checkboxes all have the same 'name' property.  This jQuery solution merely requires them to all be in the same FIELDSET.  Clean, simple and effective.  Brilliant solution.  Bravo Brian Cray!

SUMMARY

This code checks/unchecks all checkboxes within the same fieldset. A simple end elegant solution to a problem that would be much more involved in Javascript alone.

HTML

<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 fieldset
	<div><input type="checkbox"> Checkbox</div>
	<div><input type="checkbox"> Checkbox</div>
	<div><input type="checkbox"> Checkbox</div>
</fieldset>

The jQuery Piece

$(function () { // this line makes sure this code runs on page load
	$('.checkall').click(function () {
		$(this).parents('fieldset:eq(0)').find(':checkbox').attr('checked', this.checked);
	});
});

You can see it in action here in Brian's site:

http://briancray.com/tests/checkboxes/index.html

(855) 778-2732
Copyright © Square Squared