Menu ▼



Posted By :
avatarLearn DotNet
Total Views : 4216

Check and uncheck All Checkboxes in Grid view using javascript


SnoNameEmp NoDesignation
0 Name-0 Empno-0 Designation-0
1 Name-1 Empno-1 Designation-1
2 Name-2 Empno-2 Designation-2
3 Name-3 Empno-3 Designation-3
4 Name-4 Empno-4 Designation-4
5 Name-5 Empno-5 Designation-5
6 Name-6 Empno-6 Designation-6
7 Name-7 Empno-7 Designation-7
8 Name-8 Empno-8 Designation-8
9 Name-9 Empno-9 Designation-9
10 Name-10 Empno-10 Designation-10
11 Name-11 Empno-11 Designation-11
12 Name-12 Empno-12 Designation-12
13 Name-13 Empno-13 Designation-13
14 Name-14 Empno-14 Designation-14




Aspx Page:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication2.WebForm2" %>

<!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></title>

    <script type="text/javascript">

        function checkAll(gvExample, colIndex) {

            var GridView = gvExample.parentNode.parentNode.parentNode;

            for (var i = 1; i < GridView.rows.length; i++) {

                var chb = GridView.rows[i].cells[colIndex].getElementsByTagName("input")[0];

                chb.checked = gvExample.checked;

            }

        }

 

        function checkItem_All(objRef, colIndex) {

            var GridView = objRef.parentNode.parentNode.parentNode;

            var selectAll = GridView.rows[0].cells[colIndex].getElementsByTagName("input")[0];

            if (!objRef.checked) {

                selectAll.checked = false;

            }

            else {

                var checked = true;

                for (var i = 1; i < GridView.rows.length; i++) {

                    var chb = GridView.rows[i].cells[colIndex].getElementsByTagName("input")[0];

                    if (!chb.checked) {

                        checked = false;

                        break;

                    }

                }

                selectAll.checked = checked;

            }

        }

 

 

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <div>

        <asp:GridView ID="gvExample" runat="server" AutoGenerateColumns="false" AlternatingRowStyle-BackColor="#C2D69B"

            HeaderStyle-BackColor="#C2D69B">

            <Columns>

                <asp:TemplateField>

                    <HeaderTemplate>

                        <asp:CheckBox ID="chkAll" runat="server" onclick="checkAll(this,0);" />

                    </HeaderTemplate>

                    <ItemTemplate>

                        <asp:CheckBox ID="chkitem" runat="server" onclick="checkItem_All(this,0)" />

                    </ItemTemplate>

                </asp:TemplateField>

                <asp:TemplateField HeaderText="Sno" HeaderStyle-Width="50px" HeaderStyle-HorizontalAlign="Left">

                    <ItemTemplate>

                        <asp:Label ID="lblSno" runat="server" Text='<%# Bind("SNO") %>'></asp:Label>

                    </ItemTemplate>

                </asp:TemplateField>

                <asp:TemplateField HeaderText="Name" HeaderStyle-Width="100px" HeaderStyle-HorizontalAlign="Left">

                    <ItemTemplate>

                        <asp:Label ID="lblName" runat="server" Text='<%# Bind("Name") %>'></asp:Label>

                    </ItemTemplate>

                </asp:TemplateField>

                <asp:TemplateField HeaderText="Emp No" HeaderStyle-Width="100px" HeaderStyle-HorizontalAlign="Left">

                    <ItemTemplate>

                        <asp:Label ID="lblEmpno" runat="server" Text='<%# Bind("Empno") %>'></asp:Label>

                    </ItemTemplate>

                </asp:TemplateField>

                <asp:TemplateField HeaderText="Designation" HeaderStyle-Width="100px" HeaderStyle-HorizontalAlign="Left">

                    <ItemTemplate>

                        <asp:Label ID="lblDesignation" runat="server" Text='<%# Bind("Designation") %>'></asp:Label>

                    </ItemTemplate>

                </asp:TemplateField>

            </Columns>

        </asp:GridView>

    </div>

    </form>

</body>

</html>

 

Code Behind :

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data;

namespace WebApplication2

{

    public partial class WebForm2 : System.Web.UI.Page

    {

        DataTable dt = new DataTable();

        DataRow dr;

       

        protected void Page_Load(object sender, EventArgs e)

        {

            bindGrid();

        }

 

        public void bindGrid()

        {

            dt.Columns.Add("SNO");

            dt.Columns.Add("Name");

            dt.Columns.Add("Empno");

            dt.Columns.Add("Designation");

            for (int i = 0; i < 15; i++)

            {

                dr = dt.NewRow();

                dr["SNO"] = i;

                dr["Name"] = "Name-" + i;

                dr["Empno"] = "Empno-" + i;

                dr["Designation"] = "Designation-" + i;

                dt.Rows.Add(dr);

                dt.AcceptChanges();

                gvExample.DataSource = dt;

                gvExample.DataBind();

            }

        }

    }

}

 






comments powered by Disqus


Search dotnetlearners.com