Question

enter image description here

我的代码是

function CheckAll(oCheckbox)
 {
 var GridView2 = document.getElementById("<%=dgShiftOverrideData.ClientID %>");
         for (i = 1; i < ctl00_ContentPlaceHolder1_dgShiftOverrideData.rows.length; i++)
 {
             ctl00_ContentPlaceHolder1_dgShiftOverrideData.rows[i].cells[0].getElementsByTagName("INPUT")[0].checked = oCheckbox.checked;
  }
}

<asp:TemplateColumn HeaderText="Delete" HeaderStyle-ForeColor="White">
                                                       <HeaderTemplate>
                                                           <asp:CheckBox ID="CheckBox3"  Checked="false" onclick="CheckAll(this)" AutoPostBack="true" runat="server" />
                                                       </HeaderTemplate>
                                                        <ItemTemplate>
                                                            <asp:CheckBox ID="chkDelete_SO" runat="server"  />
                                                        </ItemTemplate>
                                                        <HeaderStyle CssClass="SentinelGridHeader" />
                                                    </asp:TemplateColumn>

Answer 1

要检查子复选框，请使用此

function CheckAll(oCheckbox)
{
("<%=dgShiftOverrideData.ClientID %>").find("input:checkbox").each(function () {
if (this != oCheckbox) {this.checked = oCheckbox.checked;}
});
}

请参阅此链接 https://www.aspsnippets.com/Articles/Check-Uncheck-all-CheckBoxes-in-ASPNet-GridView-using-jQuery.aspx

我创建了以下工作的aspx页面，你可以了解这个

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>

    <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.2.1.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script>

</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
            <script>

                function CheckAll(oCheckbox) {
                    $("#<%= dgShiftOverrideData.ClientID%>").find("input:checkbox").each(function () {
                        if (this != oCheckbox) { this.checked = oCheckbox.checked; }
                    });
                }

            </script>

            <asp:DataGrid ID="dgShiftOverrideData" runat="server" AllowPaging="True" AllowSorting="True" Width="100%" >
                <Columns>
                    <asp:TemplateColumn HeaderText="Delete" HeaderStyle-ForeColor="White">
                        <HeaderTemplate>
                            <asp:CheckBox ID="CheckBox3" Checked="false" onclick="CheckAll(this)" runat="server" />
                        </HeaderTemplate>
                        <ItemTemplate>
                            <asp:CheckBox ID="chkDelete_SO" runat="server" />
                        </ItemTemplate>
                        <HeaderStyle CssClass="SentinelGridHeader" />
                    </asp:TemplateColumn>
                </Columns>
            </asp:DataGrid>
        </div>
    </form>
</body>
</html>

您的代码中所做的更改：

从复选框
添加了Jquery

Answer 2

这个代码片段就是您所需要的。它会在标题复选框中添加一个监听器，并在更改时更改所有其他标识符。

<script type="text/javascript">
    $("#<%= GridView1.ClientID %> th input:checkbox").change(function () {
        var is_checked = this.checked;
        $("#<%= GridView1.ClientID %> tr").each(function () {
            $(this).find("td input:checkbox").each(function (index, element) {
                this.checked = is_checked;
            });
        });
    });
</script>

当我点击标题中的复选框时，应选中以下所有复选框

2 个答案: