Check Multiple Checkboxes in one click using jQuery

Posted on: Mar 24, 2008 by wenbert

This is useful if you want to “delete” or “update” multiple rows in a table at the same time. This works like the “Check All Email” in YahooMail.

$(document).ready(function() {
    //check all checkboxes
    $("#check_all_boxes").click(function() {
        $(".mycheckbox").each(function(i){
            $(this).attr("checked","checked");
        });
    });
 
    //uncheck all checkboxes
    $("#uncheck_all_boxes").click(function() {
        $(".mycheckbox").each(function(i){
            $(this).removeAttr("checked");
        });
    });
 
    //reset the search form
    $("#reset_button").click(function() {
        $("#search_form input").each(function(i) {
            //alert($(this).html());
 
        });
    });
 
});

And the HTML Code is:

< input class="mycheckbox" name="a" value="1" type="checkbox" />Number 1
< input class="mycheckbox" name="b" value="1" type="checkbox" />Number 2
< input class="mycheckbox" name="c" value="1" type="checkbox" />Number 3
< a href="#" id="#check_all_boxes">Check All< / a>
< a href="#" id="#uncheck_all_boxes">Uncheck All< / a>

Subscribe to comments Comment | Trackback |
Post Tags: ,

Browse Timeline


Add a Comment


XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">


© Copyright 2007 eKini Web Developer Blog . Thanks for visiting!