Category: Silverlight

05 May 2013 23:01

Joined:	01/04/2013
Level:	Bronze
Points:	19

Points:	4

How to uncheck header checkbox if any row checkbox is unchecked ?

Are you looking for a way to uncheck header checkbox if any row checkbox is unchecked ? then read this thread to know more about it

Sir,
i have a datagrid in which i placed checkbox with header checkbox.When user select header checkbox all datagrid cell checkbox should be check.
This scenario is working fine. but when i unchecked any one checkbox from datagrid,Header checkbox is not unchecking.
So, My issue coming is that to uncheck any child checkbox should result uncheck header checkbox and when all child checkbox select, then result should be header checkbox automatically select.

Pls guide me

Mks

#715172

05 May 2013 23:52

Joined:	30/04/2012
Level:	Gold
Points:	7233

Points:	3

You can use this code for uncheck header check box . I post code snippet for the header template of uncheck header of gridview.


<HeaderTemplate>
                <asp:CheckBox runat="server" ID="cbDeleteAll" AutoPostBack="True" OnCheckedChanged="cbDeleteAll_CheckedChanged">
                </asp:CheckBox>
</HeaderTemplate>

#715176

05 May 2013 23:57

Joined:	01/04/2013
Level:	Bronze
Points:	19

Points:	1

Sir,

i have this issue in silverlight

#715249

06 May 2013 03:05

Joined:	12/11/2009
Level:	Gold
Points:	43848

Points:	4

Hi,
Below is the JavaScript, keep this in your .ASPX page header tag


    <script type="text/javascript">
        function CheckAllRow(chkBox) {
            var gridViewCtlId = '<%=GridView1.ClientID%>';
            var grid = document.getElementById(gridViewCtlId);
            var gridLength = grid.rows.length;
            for (var i = 1; i < gridLength; i++) {
                cell = grid.rows[i].cells[1];
                for (var j = 0; j < cell.childNodes.length; j++) {
                    if (cell.childNodes[j].type == 'checkbox') {
                        cell.childNodes[j].checked = chkBox;
                    }
                }
            }
        }

Gridview code. Check how we are calling the JavaScript function. Especially check the True or false we are passing to get the status of Check box.


    </script>

    <div>
        <asp:LinkButton ID="CheckBoxAll" Text="Check all" OnClientClick=" CheckAllRow(true); return false;" runat="server"></asp:LinkButton><br/>
        <asp:LinkButton ID="lnkUncheck" Text="Uncheck all" OnClientClick=" CheckAllRow(false); return false;" runat="server"></asp:LinkButton><br/>
        <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" AutoGenerateSelectButton="True" OnSelectedIndexChanged="GridView1_SelectedIndexChanged"
            OnDataBound="GridView1_DataBound" OnRowDataBound="GridView1_RowDataBound">
            <Columns>
                <asp:TemplateField>
                    <HeaderTemplate>
                        Select All
                        <asp:CheckBox ID="chkBoxAll" runat="server" onclick="CheckAllRow(this.checked);" />
                    </HeaderTemplate>
                    <ItemTemplate>
                        <asp:CheckBox ID="chkBoxSel" runat="server" />
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Employee ID">
                    <ItemTemplate>
                        <%# Eval("ID") %>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Employee Name">
                    <ItemTemplate>
                        <%# Eval("Employee_Name")%>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Employee Address">
                    <ItemTemplate>
                        <%# Eval("Employee_Address")%>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Employee Phone">
                    <ItemTemplate>
                        <%# Eval("Employee_Phone")%>
                    </ItemTemplate>
                </asp:TemplateField>
                <asp:TemplateField HeaderText="Description">
                    <ItemTemplate>
                        <%# Eval("Description") %>
                    </ItemTemplate>
                </asp:TemplateField>
            </Columns>
        </asp:GridView>
    </div>


Regards,
Asheej T K

#715254
06 May 2013 03:14

Joined: 05/11/2011
Level: Silver
Points: 108
Points: 4

Joined:	05/11/2011
Level:	Silver
Points:	108

Default.aspx code

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<!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" language="javascript">
function Selectall_Deselectall(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('checkpoint') > -1))
{
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('checkpoint') > -1))
{
document.forms[0].elements[i].checked = false;
}
}
}
}
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="true">
    <Columns>
             
    <asp:TemplateField>
    <HeaderTemplate>
    <input type="checkbox" name="SelectAllCheckBox" onclick="Selectall_Deselectall(this)">
    </HeaderTemplate>
    <ItemTemplate>
    <asp:CheckBox id="checkpoint" runat="server" ></asp:CheckBox>
    </ItemTemplate>
    </asp:TemplateField>
    </Columns>
 </asp:GridView>

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


Default.aspx.vb code

Imports System.Data.SqlClient
Imports System.Data
Partial Class _Default
    Inherits System.Web.UI.Page
    Dim strConnString As String = System.Configuration.ConfigurationManager.ConnectionStrings.Item("ConnectionString").ToString()
    Dim con As New SqlConnection(strConnString)
    Dim str As String
    Dim com As SqlCommand
    Dim sqlda As SqlDataAdapter
    Dim ds As DataSet
    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        con.Open()
        str = "select * from student"
        com = New SqlCommand(Str, con)
        Dim reader As SqlDataReader
        reader = com.ExecuteReader()
        GridView1.DataSource = reader
        GridView1.DataBind()
        con.Close()
    End Sub
End Class

#722508
10 Jul 2013 01:57

Joined: 11/01/2011
Level: Bronze
Points: 22
Points: 3

Joined:	11/01/2011
Level:	Bronze
Points:	22

use the following java script code
function CheckUncheck() {
            var childCtrl = "chkSelect";
            var Inputs = document.getElementsByTagName("input");
            var upperBound = Inputs.length;
            for (var n = 0; n < upperBound; ++n) {
                if (Inputs[n].type == 'checkbox' && Inputs[n].id.indexOf(childCtrl, 0) >= 0 && Inputs[n].checked)
                    return true;
            }
            return false;
        }

#722511
10 Jul 2013 02:54

Joined: 03/05/2013
Level: Gold
Points: 15822
Points: 4

Joined:	03/05/2013
Level:	Gold
Points:	15822

Hi Use the below code.


 <asp:TemplateField ItemStyle-Width="10%">
                                                 <HeaderTemplate>
                                                        <input id="chkSelect" type="checkbox" onclick="CheckAllTo(this)" runat="server" />
                                                 </HeaderTemplate>

                                                <ItemTemplate>
                                                    <asp:CheckBox ID="chkSelect" runat="server" />
                                                </ItemTemplate>
                                                </asp:TemplateField>




javascript code:

function CheckAllTo(oCheckbox) {
            var gvTo = document.getElementById("<%=gvTo.ClientID %>");

            for (i = 1; i < gvTo.rows.length; i++) {
                gvTo.rows[i].cells[0].getElementsByTagName("INPUT")[0].checked = oCheckbox.checked;
            }

        }


hope this code will resolve your problem.
--------------------------------------------------------------------------------
Give respect to your work, Instead of trying to impress your boss.

N@veen
Blog :  http://naveens-dotnet.blogspot.in/

How to uncheck header checkbox if any row checkbox is unchecked ?

Email subscription

About dotnetspider.com

Quick Links

General

Services