jQuery Check & Uncheck All - Update
Go here for the final verison of jQuery check/uncheck all
I had a chat with a colleague about my check/un-check all function yesterday.
He liked the idea but felt it was a bit too obtrusive so I’ve rewritten it a bit.
It doesn’t affect your DOM much at all and if you don’t have javascript enabled you won’t see the checkall option any more.
The HTML
The fieldset I’ve used in this example can be exchanged for any other container such as a div, p td or what ever suits you. You can also add what ever mark up you want around the check boxes.
<fieldset class="checkallgroup"> <input type="checkbox" /> Box 1 <input type="checkbox" /> Box 2 </fieldset>
$(document).ready(function()
{
$('.checkallgroup').append('<label><input type="checkbox" class="checkallselect" />&amp;amp;amp;amp;nbsp;Select/Deselect All</label>');
$('input.checkallselect').click(function()
{
if($(this).data('status') === undefined || $(this).data('status') == 'true')
{
$(this).parent('<label>').parent('.checkallgroup').find('input[@type=checkbox]').attr('checked', 'checked');
$(this).data('status', 'false');
}
else
{
$(this).parent('<label>').parent('.checkallgroup').find('input[@type=checkbox]').removeAttr('checked');
$(this).data('status', 'true');
}
});
});
Share this post:
