I have a table with a checkbox at the start of each row. Each Checkbox has the ID of #tablecheckbox. The table header row has a check icon which should check all boxed in the table. How can I do this with jQuery?
- 
        What have you already tried?Andrey Shchekin– Andrey Shchekin2013-08-16 05:29:23 +00:00Commented Aug 16, 2013 at 5:29
 - 
        5^^ and ID's should be unique.dc5– dc52013-08-16 05:29:51 +00:00Commented Aug 16, 2013 at 5:29
 - 
        Make your ids a class, then follow this link: stackoverflow.com/questions/426258/…bfavaretto– bfavaretto2013-08-16 05:31:02 +00:00Commented Aug 16, 2013 at 5:31
 - 
        instead of using id try to use name attriubute it can help to check all check boxs.tamilmani– tamilmani2013-08-16 05:32:15 +00:00Commented Aug 16, 2013 at 5:32
 - 
        Can you please show the code for your table (at least the header and a few body rows)?rink.attendant.6– rink.attendant.62013-08-16 05:38:49 +00:00Commented Aug 16, 2013 at 5:38
 
                    
                        
                    
                 | 
            
                Show 1 more comment
            
        
         
    2 Answers
Here head_checkbox is id of top header and person class is all row checkbox
 $('#head_checkbox').on('change', function () {
            if ($(this).is(':checked')) {
                $('.person').attr('checked', true);
            } else {
                $('.person').attr('checked', false);
            }
        });
        $('.person').click(function () {
            var total_length = $('.person').length;
            var total_checked_length = $('.person:checked').length;
            if (total_length == total_checked_length) {
                $('#head_checkbox').attr('checked', true);
            } else {
                $('#head_checkbox').attr('checked', false);
            }
        });
    2 Comments
DGS
 live is deprecated since 1.7 on() should be used instead
  Aryan Firouzian
 I used to set 
  document.getElementById("head_checkbox").checked attribute. Your approach seems more clean. Thanks.       $('#head_checkbox').click(function () {
            if ($(this).is(':checked')) {
                $('.person').attr('checked', true);
            } else {
                $('.person').attr('checked', false);
            }
        });
        $('.person').click(function () {
            if ($('.person').length == $('.person:checked').length) {
                $('#head_checkbox').attr('checked', true);
            } else {
                $('#head_checkbox').attr('checked', false);
            }
        });