Установите один флажок из двух столбцов - PullRequest
0 голосов
/ 16 декабря 2011

У меня есть 2 столбца флажков в сетке, где заголовок также содержит флажок.Если я выберу флажок заголовка, он будет проверять все соответствующие флажки в своей колонке.Теперь, что я хочу сделать, это если я выберу флажок в столбце 1, флажки в столбце 2 должны быть сняты и наоборот.Мой код, как показано ниже, будет полезна помощь:

<%@ 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 id="Head1" runat="server">
    <title></title>
    <style type="text/css">
        #form1
        {
            height: 138px;
            width: 509px;
        }
    </style>
     <script type="text/javascript" >
        function SelectAll(id)
        {
             // alert(id); 
             // GridView_ctl01_cbSelectAll 
            //get reference of GridView control
            var cell; 
            var cellnext;

            if(id =='GridView_ctl01_cbSelectAll')

            {
            var grid = document.getElementById("<%= GridView.ClientID %>");
            //variable to contain the cell of the grid


            if (grid.rows.length > 0)
            {
                //loop starts from 1. rows[0] points to the header.
                for (i=1; i<grid.rows.length; i++)
                {
                    //get the reference of first column
                    cell = grid.rows[i].cells[1];

                    //loop according to the number of childNodes in the cell
                    for (j=0; j<cell.childNodes.length; j++)
                    {           
                        //if childNode type is CheckBox                 
                        if (cell.childNodes[j].type =="checkbox")
                        {
                        //assign the status of the Select All checkbox to the cell checkbox within the

                            cell.childNodes[j].checked = document.getElementById(id).checked;


                        }
                    }
                }
            }


            }

            else
            {

            //alert("yes");
             var grid = document.getElementById("<%= GridView.ClientID %>");
            //variable to contain the cell of the grid


            if (grid.rows.length > 0)
            {
                //loop starts from 1. rows[0] points to the header.
                for (i=1; i<grid.rows.length; i++)
                {
                    //get the reference of first column
                    cellnext = grid.rows[i].cells[2];

                    //loop according to the number of childNodes in the cell
                    for (j=0; j<cellnext.childNodes.length; j++)
                    {           
                        //if childNode type is CheckBox                 
                        if (cellnext.childNodes[j].type =="checkbox")
                        {
                        //assign the status of the Select All checkbox to the cell checkbox within the grid


                           cellnext.childNodes[j].checked = document.getElementById(id).checked;


                        }
                    }





                }


            }

            }
            }

    </script>

</head>
<body>
 <form runat ="server" id="form1">
    <asp:GridView ID="GridView" runat="server" BorderWidth="1px" AutoGenerateColumns="False"
                    Width="100%" Visible="True" AutoGenerateEditButton="False" GridLines="none" ShowHeader="true"
                    SelectedRowStyle-Wrap="false">

                    <Columns>

                        <asp:TemplateField>
                            <ItemStyle Width="20%" />
                            <HeaderStyle HorizontalAlign="Left" />
                            <HeaderTemplate>
                                <strong>Name</strong>
                            </HeaderTemplate>
                            <ItemTemplate>
                                  <asp:Label runat="server" class="ms-vb" ID="lblemployees" Text='<%# Bind("Name") %>'></asp:Label>
                             </ItemTemplate>
                        </asp:TemplateField>

                        <asp:TemplateField>
                            <ItemStyle Width="35%" />
                            <HeaderStyle HorizontalAlign="Left" />
                            <HeaderTemplate>
                                <strong>
                                <asp:CheckBox ID="cbSelectAll" runat="server" onclick="return SelectAll(this.id);" AutoPostBack="false" />
                                    Sleep (6 Hours)  
                                </strong>

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

                       <asp:TemplateField>
                            <ItemStyle Width="50%" />
                            <HeaderStyle HorizontalAlign="Left" />
                            <HeaderTemplate>
                                <strong>
                                <asp:CheckBox ID="cbSelectAll1" runat="server" onclick="return SelectAll(this.id);" AutoPostBack="false" />
                                    Wake
                                </strong>

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

                    </Columns>
                </asp:GridView>
</form>
    <p>
&nbsp;&nbsp;&nbsp;
    </p>
</body>
</html>

И его исходный код:

Imports System.Data
Imports System.Data.SqlClient
Partial Public Class _Default
    Inherits System.Web.UI.Page

    Dim sqlconn As SqlConnection
    Dim sqlCmd As SqlCommand

    Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
        Dim strsql As String

        Dim s As String = "whatever it may be "
        sqlconn = New SqlConnection(s)

        Dim sqlCmd As New SqlCommand()
        Dim sqlAdp As SqlDataAdapter

        sqlconn.Open()
        strsql = "select name from tab_name"
        sqlCmd.Connection = sqlconn
        sqlCmd.CommandText = strsql
        sqlAdp = New SqlDataAdapter()
        sqlAdp.SelectCommand = sqlCmd
        Dim DS As New DataSet()
        sqlAdp.Fill(DS, "Return")
        Dim dt As New DataTable()
        dt = DS.Tables(0)
        sqlCmd.Dispose()
        sqlconn.Close()
        GridView.DataSource = dt
        GridView.DataBind()

    End Sub


    'Protected Sub GridView_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GridView.RowDataBound
    '    If e.Row.RowType = DataControlRowType.Header Then
    '        'Find the checkbox control in header and add an attribute
    '        DirectCast(e.Row.FindControl("cbSelectAll"), CheckBox).Attributes.Add("onclick", "javascript:SelectAll('" + DirectCast(e.Row.FindControl("cbSelectAll"), CheckBox).ClientID & "')")
    '    End If
    'End Sub
End Class

Ответы [ 2 ]

1 голос
/ 16 декабря 2011

Вот решение, которое я придумал для этого:

function SelectAll(id)
{
    //get reference of GridView control
    var grid = document.getElementById("<%= GridView.ClientID %>");
    if (grid.rows.length > 0)
    {
        var onIndex;
        var offIndex;

        // First, assume that the item is checked
        if (id == 'GridView_ctl01_cbSelectAll') {
            // Assuming col1 is checked, set the onindex to 1 and of to 2
            onIndex = 1;
            offIndex = 2;
        } else {
            onIndex = 2;
            offIndex = 1;
        }

        // If the column is not checked, swap the indexes.
        if (!document.getElementById(id).checked) {
            var tempIndex;
            tempIndex = onIndex;
            onIndex = offIndex;
            offIndex = tempindex;
        }

        // loop starts from 1. rows[0] points to the header.
        for (var i = 1; i < grid.rows.length; i++) {
            var row = grid.rows[i];
            SetCellCheckBox(row.cells[onIndex], true);
            SetCellCheckBox(row.cells[offIndex], false);
        }
    }

    function SetCellCheckBox(cell, value) {

        // loop according to the number of childNodes in the cell
        for (var j = 0; j < cell.childNodes.length; j++) {
            //if childNode type is CheckBox                 
            if (cell.childNodes[j].type == "checkbox") {
                //assign the status of the Select All checkbox to the cell checkbox within the
                cell.childNodes[j].checked = value;
                // Bail once we have found the checkbox
                return;
            }
        }
    }
}
0 голосов
/ 16 декабря 2011

Это может быть вам на помощь.Я решил это с помощью jQuery.Вы можете скачать библиотеку здесь: http://docs.jquery.com/Downloading_jQuery

Вот мое предложение:

<script src="jquery-1.7.1.js" type="text/javascript"></script>

    <asp:GridView ID="gvTest" runat="server" Width="100%">
        <Columns>             
        <asp:TemplateField>
            <HeaderTemplate>                      
                <asp:CheckBox ID="checkAll" runat="server" onclick="CheckAll(this,0);" />   
            </HeaderTemplate>                  
            <ItemTemplate>                       
                <input type="checkbox" class="dummychkstyle" id="chkSelect" runat="server" />                                   
            </ItemTemplate>
        </asp:TemplateField>
        <asp:TemplateField>
            <HeaderTemplate>                      
                <asp:CheckBox ID="checkAll2" runat="server" onclick="CheckAll(this,1);" />   
            </HeaderTemplate>                  
            <ItemTemplate>                       
                <input type="checkbox" class="dummychkstyle2" id="chkSelect2" runat="server" />                                   
            </ItemTemplate>
        </asp:TemplateField>    
        </Columns>
    </asp:GridView>
    <script language="javascript" type="text/javascript">
        function CheckAll(selectChk, index) {
            if (index == 0) {
                CheckCheckboxes(".dummychkstyle", ".dummychkstyle2", $(selectChk).attr('checked'));
            }
            else {
                CheckCheckboxes(".dummychkstyle2", ".dummychkstyle", $(selectChk).attr('checked'));
            }
        }
        function CheckCheckboxes(column1Class, column2Class, checked) {
            if (checked) {
                $(column1Class).attr('checked', true);
                $(column2Class).attr('checked', false);
            }
            else {
                $(column1Class).attr('checked', false);
                $(column2Class).attr('checked', true);
            }
        } 
    </script>
...