Here i will show how to Check or UnCheck Gridview CheckBoxes using Jquery. As the title says it checks only current gridview page.
Script to check All CheckBoxes :
<script type="text/javascript">
Full ASPX Page :
Script to check All CheckBoxes :
<script type="text/javascript">
function CheckUnCheckAll(chk) {
$('#<%=gvCheckAll.ClientID %>').find("input:checkbox").each(function () {
if (this != chk) {
this.checked = chk.checked;
}
});
}
</script>
Full ASPX Page :
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="MainPage.aspx.cs"
Inherits="CheckUnCheck_Jquery.MainPage" %>
<!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>Check Uncheck All checkBoxes in gridview page</title>
<script src="js/jquery-1.8.0.min.js" type="text/javascript"></script>
<script type="text/javascript">
function CheckUnCheckAll(chk) {
$('#<%=gvCheckAll.ClientID %>').find("input:checkbox").each(function () {
if (this != chk) {
this.checked = chk.checked;
}
});
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<center>
<h2>
Check/Uncheck All checkBoxes in gridview page<br />
using Jquery</h2>
<asp:GridView ID="gvCheckAll" runat="server" BackColor="White"
AutoGenerateColumns="false" BorderColor="#CC9966" BorderStyle="None"
BorderWidth="1px" CellPadding="4" AllowPaging="true"
OnPageIndexChanging="gvCheckAll_PageIndexChanging">
<Columns>
<asp:TemplateField HeaderText="EMP ID">
<ItemTemplate>
<asp:Label ID="lblempid" runat="server"
Text='<%# Eval("empid") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="DeptID">
<ItemTemplate>
<asp:Label ID="lbldeptid" runat="server"
Text='<%# Eval("deptid") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Full Name">
<ItemTemplate>
<asp:Label ID="lblfullname" runat="server"
Text='<% #Eval("fullname") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Designation">
<ItemTemplate>
<asp:Label ID="lbldes" runat="server"
Text='<%# Eval("designation") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField HeaderText="Qualification">
<ItemTemplate>
<asp:Label ID="lblqual" runat="server"
Text='<%# Eval("qualification") %>' />
</ItemTemplate>
</asp:TemplateField>
<asp:TemplateField>
<HeaderTemplate>
<asp:CheckBox ID="chkMain" runat="server"
onclick="javascript:CheckUnCheckAll(this);" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkChild" runat="server" />
</ItemTemplate>
</asp:TemplateField>
</Columns>
<FooterStyle BackColor="#FFFFCC" ForeColor="#330099" />
<HeaderStyle BackColor="#990000" Font-Bold="True" ForeColor="#FFFFCC" />
<PagerStyle BackColor="#FFFFCC" ForeColor="#330099" HorizontalAlign="Center" />
<RowStyle BackColor="White" ForeColor="#330099" />
<SelectedRowStyle BackColor="#FFCC66" Font-Bold="True" ForeColor="#663399" />
<SortedAscendingCellStyle BackColor="#FEFCEB" />
<SortedAscendingHeaderStyle BackColor="#AF0101" />
<SortedDescendingCellStyle BackColor="#F6F0C0" />
<SortedDescendingHeaderStyle BackColor="#7E0000" />
</asp:GridView>
</center>
</div>
</form>
</body>
</html>
Code Behind :
using System;
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
namespace CheckUnCheck_Jquery
{
public partial class MainPage : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
gridviewBind();
}
}
private void gridviewBind()
{
string constring =
ConfigurationManager.ConnectionStrings["myconstring"].ToString();
string query = "select e.empid, e.DeptID,(e.fname +' '+e.lname) as fullname,
e.designation,e .qualification from EMPTable e";
DataSet ds = new DataSet();
SqlDataAdapter da = new SqlDataAdapter(query, constring);
da.Fill(ds,"grid");
gvCheckAll.DataSource = ds;
gvCheckAll.DataBind();
}
protected void gvCheckAll_PageIndexChanging(object sender,
System.Web.UI.WebControls.GridViewPageEventArgs e)
{
gvCheckAll.PageIndex = e.NewPageIndex;
gridviewBind();
}
}
}
Download From HERE
No comments:
Post a Comment