Here is the jQuery implementation of Select All checkbox functionality inside a HTML table. Try out the attached working sample. HTML: <table border="1"> <tr><th><input type="checkbox" id="selectall" /></th> <th>Heading1 </th><th>Heading2 </th> </tr> <tr> <td align="center"> <input type="checkbox" class="case" name="case" value="1" /> </td> <td>Row1</td> <td>Row1</td> </tr> <tr> <td align="center"> <input type="checkbox" class="case" name="case" value="2" /></td> <td>Row2</td> <td> Row2</td> </tr> jQuery: <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"> </script>
<script type="text/javascript" > $(document).ready(function() { // add multiple select / deselect functionality $("#selectall").click(function() { $('.case').attr('checked', this.checked); }); // if all checkbox are selected, check the selectall checkbox also
$(".case").click(function() { if ($(".case").length == $(".case:checked").length) { $("#selectall").attr("checked", "checked"); } else { $("#selectall").removeAttr("checked"); } }); }); </script> Thanks shinu .