[Web-development (jquery)] Multiple Checkbox Select/Deselect jquery

Multiple Checkbox Select/Deselect jquery

<STYLE> body, input{ font-family: Calibri, Arial; margin:0px; } h1 { margin: 0 0 0 20px; } html, body, #container { height: 100%; } body > #container { height: auto; min-height: 100%; } #header { height:50px; background-color:#ddd; border-bottom:1px solid #aaa; width:100%; } #footer { font-size: 12px; clear: both; position: relative; z-index: 10; height: 3em; margin-top: -3em; text-align:center; } table { width: 300px; border: 1px solid; border-collapse:collapse; margin: 0 0 0 20px; } th { background-color:#3E6DB0; color: white; padding: 5px; } </STYLE> <H1>Multiple Checkbox Select/Deselect</H1> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <table> <tr> <th><input type="checkbox"/></th> <th>Programming Language</th> </tr> <tr> <td align="center"><input type="checkbox" name="case" value="1"/></td> <td>PHP Programming</td> </tr> <tr> <td align="center"><input type="checkbox" name="case" value="2"/></td> <td>Java Script</td> </tr> <tr> <td align="center"><input type="checkbox" name="case" value="3"/></td> <td>Jquery</td> </tr> <tr> <td align="center"><input type="checkbox" name="case" value="4"/></td> <td>Java</td> </tr> </table> <SCRIPT> $(function(){ // add multiple select / deselect functionality $("#selectall").click(function () { $('.case').attr('checked', this.checked); }); // if all checkbox are selected, check the selectall checkbox // and viceversa $(".case").click(function(){ if($(".case").length == $(".case:checked").length) { $("#selectall").attr("checked", "checked"); } else { $("#selectall").removeAttr("checked"); } }); }); </SCRIPT>

other source : http://fb.com, http://liputan6.com, http://tutorial101.blogspot.com