It is possible but only using jQuery and few things the Grid must have common
1. Header CheckBox ID must be chkHeader
2. Row CheckBox ID must be chkRow
for all Grids
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$("[id*=chkHeader]").live("click", function () {
var chkHeader = $(this);
var grid = $(this).closest("table");
$("input[type=checkbox]", grid).each(function () {
if (chkHeader.is(":checked")) {
$(this).attr("checked", "checked");
$("td", $(this).closest("tr")).css({ "background-color": "#A1DCF2" });
} else {
$(this).removeAttr("checked");
$("td", $(this).closest("tr")).css({ "background-color": "#FFF" });
}
});
});
$("[id*=chkRow]").live("click", function () {
var grid = $(this).closest("table");
var chkHeader = $("[id*=chkHeader]", grid);
if (!$(this).is(":checked")) {
$("td", $(this).closest("tr")).css({ "background-color": "#FFF" });
chkHeader.removeAttr("checked");
} else {
$("td", $(this).closest("tr")).css({ "background-color": "#A1DCF2" });
if ($("[id*=chkRow]", grid).length == $("[id*=chkRow]:checked", grid).length) {
chkHeader.attr("checked", "checked");
}
}
});
</script>
<asp:GridView ID="GridView1" CssClass="Grid" runat="server" Width="300" HeaderStyle-BackColor="#3AC0F2"
HeaderStyle-ForeColor="White"
AutoGenerateColumns="false">
<Columns>
<asp:TemplateField>
<HeaderTemplate>
<asp:CheckBox ID="chkHeader" runat="server" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkRow" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="Name" HeaderText="Name" />
<asp:BoundField DataField="Country" HeaderText="Country" />
</Columns>
</asp:GridView>
<hr />
<asp:GridView ID="GridView2" CssClass="Grid" runat="server" Width="300" HeaderStyle-BackColor="#3AC0F2"
HeaderStyle-ForeColor="White" AutoGenerateColumns="false">
<Columns>
<asp:TemplateField>
<HeaderTemplate>
<asp:CheckBox ID="chkHeader" runat="server" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkRow" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="Name" HeaderText="Name" />
<asp:BoundField DataField="Country" HeaderText="Country" />
</Columns>
</asp:GridView>
<hr />
<asp:GridView ID="GridView3" CssClass="Grid" runat="server" Width="300" HeaderStyle-BackColor="#3AC0F2"
HeaderStyle-ForeColor="White" RowStyle-BackColor="#A1DCF2" AlternatingRowStyle-BackColor="White"
AutoGenerateColumns="false">
<Columns>
<asp:TemplateField>
<HeaderTemplate>
<asp:CheckBox ID="chkHeader" runat="server" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkRow" runat="server" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="Name" HeaderText="Name" />
<asp:BoundField DataField="Country" HeaderText="Country" />
</Columns>
</asp:GridView>
protected void Page_Load(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
DataTable dt = new DataTable();
dt.Columns.AddRange(new DataColumn[2] { new DataColumn("Name"), new DataColumn("Country") });
dt.Rows.Add("John Hammond", "Canada");
dt.Rows.Add("Rick Stewards", "United States");
dt.Rows.Add("Huang He", "China");
dt.Rows.Add("Robert Williams", "England");
GridView1.DataSource = dt;
GridView1.DataBind();
GridView2.DataSource = dt;
GridView2.DataBind();
GridView3.DataSource = dt;
GridView3.DataBind();
}
}