Check all Checkbox of HTML Table Using JQuery

Lets we have a HTML Table and we have checkbox in every row and we have a checkbox in Table Header.. now we want that when we click on checkbox of table header then all checkbox of table should be checked/unchecked according checked state of checkbox in table header.. using JQuery
eg:

< %@ Page Language="C#" AutoEventWireup="true" CodeFile="chkall.aspx.cs" Inherits="chkall" % >

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >

< html xmlns="http://www.w3.org/1999/xhtml" >
< head runat="server" >
< title >Untitled Page< /title >
< script type="text/javascript" src="jquery.js" >< /script >
< script type="text/javascript" >
$(document).ready(function() {
$("#tableOne thead tr th:first input:checkbox").click(function() {
var checkedStatus = this.checked;
$("#tableOne tbody tr td:first-child input:checkbox").each(function() {
this.checked = checkedStatus;
});
});
});
< /script >

< /head >
< body >
< form id="form1" runat="server" >
< div >
< table id="tableOne" >
< thead >
< tr >
< th >< input type="checkbox" / >< /th >
< th >Name< /th >
< th >English< /th >
< th >Spanish< /th >
< th >Math< /th >
< th >History< /th >
< /tr >
< /thead >
< tbody >
< tr >
< td >< input type="checkbox" / >< /td >
< td >Bob Smith< /td >
< td >80< /td >
< td >70< /td >
< td >75< /td >
< td >80< /td >
< /tr >
< tr >
< td >< input type="checkbox" / >< /td >
< td >George Jones< /td >
< td >90< /td >
< td >88< /td >
< td >100< /td >
< td >90< /td >

< /tr >
< tr >
< td >< input type="checkbox" / >< /td >
< td >Rob Johnson< /td >
< td >85< /td >
< td >95< /td >
< td >80< /td >
< td >85< /td >
< /tr >
< tr >
< td >< input type="checkbox" / >< /td >
< td >Rick Stevens< /td >
< td >60< /td >
< td >55< /td >
< td >100< /td >
< td >100< /td >
< /tr >
< tr >
< td >< input type="checkbox" / >< /td >
< td >Jenn Gilbert< /td >
< td >68< /td >
< td >80< /td >
< td >95< /td >
< td >80< /td >
< /tr >
< tr >
< td >< input type="checkbox" / >< /td >
< td >Rachel Thompsen< /td >
< td >100< /td >
< td >99< /td >
< td >100< /td >
< td >90< /td >
< /tr >
< tr >
< td >< input type="checkbox" / >< /td >
< td >Rick Lopez< /td >
< td >85< /td >
< td >68< /td >
< td >90< /td >
< td >90< /td >
< /tr >
< tr >
< td >< input type="checkbox" / >< /td >
< td >John Petersen< /td >
< td >100< /td >
< td >90< /td >
< td >90< /td >
< td >85< /td >
< /tr >
< tr >
< td >< input type="checkbox" / >< /td >
< td >Tad Young< /td >
< td >80< /td >
< td >50< /td >
< td >65< /td >
< td >75< /td >
< /tr >
< tr >
< td >< input type="checkbox" / >< /td >
< td >Marshall Washington< /td >
< td >85< /td >
< td >100< /td >
< td >100< /td >
< td >90< /td >
< /tr >
< /tbody >
< /table >

< /div >
< /form >
< /body >
< /html >

Article by: Rajesh Rolen the DotNet Developer