select all

by Johan Pantzare

HTML

<table id="tableId">
   <thead>
     <tr role="row">
         <th>
           <input type="checkbox" class="selectall" name="selectedId-1">Select all</input>
         </th>
           
    </tr>
   </thead>
   <tbody>
     <tr class="results-table-row odd">
       <td>
           <input type="checkbox" class="selectedId-1" name="selectedId-1"/> User One
       </td>
       <td>
          
       </td>
     </tr>
        <tr class="results-table-row odd">
       <td>
           <input type="checkbox" class="selectedId-1" name="selectedId-2"/> User two
       </td>
       <td>
         
       </td>
     </tr>
            <tr class="results-table-row odd">
       <td>
           <input type="checkbox" class="selectedId-1" name="selectedId-1"/> User Three
       </td>
                 <td>
       
       </td>
     </tr>
   </tbody>
 </table>

CSS

table td{
    padding :10px;
    margin:10px;
}

table th{
    padding :10px;
    margin:10px;
}

JavaScript

$(document).ready(function(){
    $('.selectall').change(function(){
        var checkboxGroup =   "."+this.getAttribute("name");
        $(checkboxGroup).is(':checked') ?
            $(checkboxGroup).removeAttr("checked"):
            $(checkboxGroup).prop('checked', 'checked');
    });
});