X

LATEST #JQUERY NEWS

jQuery Snippets: Check/Un-Check All Function


This easy-to-implement jQuery code snippet is super useful, and can be used to create a functionality that will check OR uncheck any checkboxes within a particular fieldeset. So for example, if your HTML looks like this:

<fieldset>
 <div><input type=“checkbox” class=“checkall”>Check All</div>
 <div><input type=“checkbox”>Check Me</div>
 <div><input type=“checkbox”>Check Me</div>
 <div><input type=“checkbox”>Check Me</div>
</fieldset>

Your jQuery code to make the .checkall class actually check all of the checkbox inputs should look something like this:

$(function () {
 $('.checkall').click(function () {
 $(this).parents('fieldset:eq(0)').find(':checkbox').attr('checked', this.checked);
 });
});

With the above code, you can easily add a “Check All” button to any of your fieldset elements.

Recently Published

article image
»

How to Use Google Analytics with jQuery Mobile

jQuery Mobile is an HTML5 based web-page framework that’s ...

article image
»

jQuery Snippets: Using jQuery to Check All Boxes

When you’ve given your users a ton of checkbox input fields ...

article image
»

Useful jQuery Code Snippets for Working with Images

Images are an essential part of any website and sometimes working ...

article image
»

How to Use jQuery to Check if Cookies are Enabled

A cookie (not the kind with chocolate chips) is a small piece of data ...

article image
»

A Beginner’s Guide to jQuery’s Selectors

We talk a lot about event methods on this site, but not so much about ...

article image
»

Add Keyboard Shortcut to Anchor Tag Using jQuery

Making a user friendly website can be quite a challenging task. There ...

Screen Shot 2017-04-23 at 10.15.41 AM
»

How to Use jQuery to Create a Sticky Navigation on Scroll

Creating “sticky” elements is something that can often be ...

article image
»

How to Use jQuery’s Keystroke Methods

jQuery has a few built-in keystroke methods that are all triggered by ...

article image
»

How to Change iFrame Styling Using jQuery

If you’ve ever had the displeasure of working with iFrames, ...