how to check all checkboxes in gridview when checked header template in asp.net

Question

4.67/5 (3 votes)

See more:

, +

hi,

I have a gridview with header template as "checkbox"

and
also have item template as checkbox

when
iam selecting header checkbox then all item template checkboxes have to check

and

if iam deselect header checkbox then all item template checkboxes have to uncheck

how can i do this without using javascript

Posted 20-Oct-11 21:13pm

Member 7932936

Add a Solution

Comments

jaimik patel 11-Dec-12 0:26am

how to use same concept in repeater for check and uncheck checkboxes?

5 solutions

Solution 1

XML

<script type="text/javascript">
function SelectAll(CheckBoxControl) 
{
if (CheckBoxControl.checked == true) 
{
var i;
for (i=0; i < document.forms[0].elements.length; i++) 
{
if ((document.forms[0].elements[i].type == 'checkbox') && 
(document.forms[0].elements[i].name.indexOf('GridView1') > -1)) 
{
if(document.forms[0].elements[i].disabled)
{
document.forms[0].elements[i].checked = false;
}
else
{
document.forms[0].elements[i].checked = true;
}
}
}
} 
else 
{
var i;
for (i=0; i < document.forms[0].elements.length; i++) 
{
if ((document.forms[0].elements[i].type == 'checkbox') && 
(document.forms[0].elements[i].name.indexOf('GridView1') > -1)) 
{
document.forms[0].elements[i].checked = false;
}
}
}
}
</script>



<asp:TemplateColumn  >
                                                                 <HeaderTemplate >
                                                                     <input id="chkSelect"  name="Select All"  onclick="SelectAll(this)" type="checkbox">All</input>
                                                                 </HeaderTemplate>

Posted 20-Oct-11 21:51pm

kishorekke

Updated 20-Oct-11 21:52pm

v2

Solution 2

check these links

http://wiki.asp.net/page.aspx/281/check-uncheck-checkboxes-in-gridview-using-javascript/[^]

http://forums.asp.net/t/1681975.aspx/1?Select+All+CheckBoxes+in+GridView+ASP+NET+using+JQuery[^]

http://www.xdevsoftware.com/blog/post/Select-All-CheckBox-in-Gridview-ASPNET.aspx[^]

Posted 20-Oct-11 21:54pm

P.Salini

Solution 3

Use this code:

C#

function SelectAll(id)
{

var grid = document.getElementById("<%= GridView1.ClientID %>");
//alert(grid);
var cell;


    if(grid.rows.length>0)
    {

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

          cell = grid.rows[i].cells[2];

            for(j=0;j<cell.childNodes.length;j++)
          {
                if(cell.childNodes[j].type=="checkbox")
                {

                 cell.childNodes[j].checked=id.checked;
                }
            }
        }
    }
}

XML

<asp:TemplateField>
                <HeaderTemplate>
                    <asp:CheckBox ID="Checkall" runat="server"  onclick="javascript:SelectAll(this);" />
                                    </HeaderTemplate>
                <ItemTemplate>
                    <asp:CheckBox ID="Chkselect" runat="server" />
                </ItemTemplate>
            </asp:TemplateField>

Posted 20-Oct-11 22:00pm

sravani.v

Solution 5

XML

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

<!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">
// Select/Deselect checkboxes based on header checkbox
function SelectheaderCheckboxes(headerchk) {

var gvcheck = document.getElementById('gvEmployeeDetails');
var i;
//Condition to check header checkbox selected or not if that is true checked all checkboxes
if (headerchk.checked) {
for (i = 0; i < gvcheck.rows.length; i++) {
var inputs = gvcheck.rows[i].getElementsByTagName('input');
inputs[0].checked = true;
}
}
//if condition fails uncheck all checkboxes in gridview
else {
for (i = 0; i < gvcheck.rows.length; i++) {
var inputs = gvcheck.rows[i].getElementsByTagName('input');
inputs[0].checked = false;
}
}
}
//function to check header checkbox based on child checkboxes condition
function Selectchildcheckboxes(header) {
var ck = header;
var count = 0;
var gvcheck = document.getElementById('gvEmployeeDetails');
var headerchk = document.getElementById(header);
var rowcount = gvcheck.rows.length;
//By using this for loop we will count how many checkboxes has checked
for (i = 1; i < gvcheck.rows.length; i++) {
var inputs = gvcheck.rows[i].getElementsByTagName('input');
if (inputs[0].checked) {
count++;
}
}
//Condition to check all the checkboxes selected or not
if (count == rowcount-1) {
headerchk.checked = true;
}
else {
headerchk.checked = false;
}
}
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:GridView ID="gvEmployeeDetails" runat="server" AutoGenerateColumns="false" DataKeyNames="userId"
                                        Style="margin-left: 0px" CssClass="fullTable zebraStrips" Width="100%"
                                        AllowPaging="True" PageSize="25" GridLines="Horizontal" >
                                        <Columns>
                                            <asp:TemplateField HeaderText="">
                                                <HeaderTemplate>
                                                    <asp:CheckBox ID="chkheader" runat="server" onclick="javascript:SelectheaderCheckboxes(this)" />
                                                </HeaderTemplate>
                                                <ItemTemplate>
                                                    <asp:CheckBox ID="chkchild" runat="server"/>
                                                </ItemTemplate>
                                            </asp:TemplateField>
                                            <asp:TemplateField HeaderText="S.No">
                                                <ItemTemplate>
                                                    <asp:Label ID="lblSNo" runat="server" Text='<%#Bind("SNo") %>'></asp:Label>
                                                </ItemTemplate>
                                            </asp:TemplateField>
                                            <asp:TemplateField HeaderText="Role ID">
                                                <ItemTemplate>
                                                    <asp:Label ID="lblRoleId" runat="server" Text='<%#Bind("userRoleId") %>'></asp:Label>
                                                </ItemTemplate>
                                            </asp:TemplateField>
                                            <asp:TemplateField HeaderText="USer Name">
                                                <ItemTemplate>
                                                    <asp:Label ID="lblUserName" runat="server" Text='<%#Bind("userName") %>'></asp:Label>
                                                </ItemTemplate>
                                            </asp:TemplateField>

                                            <asp:TemplateField HeaderText="Edit/Delete" ItemStyle-HorizontalAlign="Center">
                                                <ItemTemplate>
                                                    <asp:LinkButton ID="lnkEdit" runat="server" CommandName="EditThis" Text="Edit" CommandArgument='<%#Bind("userId") %>'></asp:LinkButton>
                                                    &nbsp;
                                                    <asp:LinkButton ID="lnkDelete" runat="server" CommandName="Delete" Text="Delete"
                                                        CommandArgument='<%#Bind("userId") %>' OnClientClick="return confirm('Are you confirm to Delete?')"></asp:LinkButton>
                                                </ItemTemplate>

<ItemStyle HorizontalAlign="Center"></ItemStyle>
                                            </asp:TemplateField>
                                        </Columns>
                                         <EmptyDataTemplate>
                                            No Records Fetched!
                                        </EmptyDataTemplate>
                                    </asp:GridView>
    </div>
    </form>
</body>
</html>

Posted 4-May-12 0:29am

aftab5124

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

AmarSinghRawat · Accepted Answer · 2011-10-20T22:20:00

Solution 4

XML

function SelectAllCheckboxes1(chk)
{
$('#<%=grdOperation.ClientID%>').find("input:checkbox").each(function () {
if (this != chk) {this.checked = chk.checked;}
});
}



<asp:GridView ID="grdOperation" runat="server">
<Columns>
<asp:BoundField DataField="PageOperationName" HeaderText="Permissions" />
<asp:TemplateField ItemStyle-Width="20px">
<HeaderTemplate>
<asp:CheckBox ID="cbSelectAll" runat="server" onclick="javascript:SelectAllCheckboxes1(this);"  />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chk" runat="server">
</asp:CheckBox>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>

Posted 20-Oct-11 22:20pm

AmarSinghRawat

Comments

Member 7932936 25-Oct-11 7:15am

thank u

my problem is solved

nomibarbarian 24-Jan-12 6:06am

Thanks budy that's simple and Ok to go. . .

Wenpeng Wang 4-Jun-13 1:49am

hello,i have a question why i code these codes the error shows"
行 47: }
行 48: //PageTitle = System_Title;
行 49: base.OnInit(e);
行 50: }
行 51: ///

stacktrace:
[HttpException (0x80004005): 控件包含代码块(即 <% ... %>)，因此无法修改控件集合。]
System.Web.UI.ControlCollection.Add(Control child) +8699175
System.Web.UI.PageTheme.SetStyleSheet() +478
System.Web.UI.Page.OnInit(EventArgs e) +8719932
YWYS.Common.PageBase.OnInit(EventArgs e) in D:\ress\20130507\YWYS.Common\PageBase.cs:49
System.Web.UI.Control.InitRecursive(Control namingContainer) +333
System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +378
".how do i do next?