-1

我有一个网格视图,其中的行包含一个复选框。在gridview下面我有一个按钮。当我单击它时,我想从客户端选择所有复选框。到目前为止,我已经阅读了有关 OnClientClick、javascript 等的内容。但我的代码不起作用。有人可以帮帮我吗?

注意:我不想选择在标题中选择复选框的复选框(我发现了很多关于此的示例),但是单击 gridview 之外的按钮

 <asp:GridView runat="server"  ID="MyGridView" EnableViewState="true" 
    AutoGenerateColumns="False" 
    ><AlternatingRowStyle BackColor="White" />

    <Columns>

    <asp:TemplateField HeaderText="Select" SortExpression="Select" ItemStyle-HorizontalAlign="Center" >
                <EditItemTemplate>
                    <asp:CheckBox ID="CkBoxSelectET" runat="server" /></EditItemTemplate>
                <ItemTemplate>
                    <asp:CheckBox ID="CkBoxSelectIT" runat="server" /></ItemTemplate>
       </asp:TemplateField>

       <asp:TemplateField HeaderText="Name" SortExpression="Name" ItemStyle-HorizontalAlign="Center" Visible="false" >
                <ItemTemplate>
                    <asp:Label ID="name" runat="server" Text='<%# Bind("Name") %>' Visible="false" /></ItemTemplate>
        </asp:TemplateField>

        <asp:TemplateField HeaderText="City" SortExpression="City" ItemStyle-HorizontalAlign="Left" >
                <ItemTemplate>
                    <asp:Label ID="lblCity" runat="server" /></ItemTemplate>
        </asp:TemplateField>

    </Columns>
    </asp:GridView>

<asp:Button runat="server" ID="btnSelect" Text="Select all" BackColor="LightGray" OnClientClick="SelectAll(id);" />

<script type="text/javascript">

var gridViewControl = document.getElementById('<%= MyGridView.ClientID %>');

function SelectAll(id) {
    for (i = 0; i < gridViewControl.elements.length; i++) {
        if (gridViewControl.elements[i].type == "checkbox") {
            gridViewControl.elements[i].checked = document.getElementById(id).checked;
        }
    }
} 

在c#中,当我绑定数据时:

 btnSelect.Attributes.Add("OnClientClick", "javascript:SelectAll('" + btnSelect.ClientID + "')");
4

4 回答 4

1

您似乎在说“如果我的按钮被'选中'(即与您传入的 ID 对应的元素),请选中此复选框”。由于无法检查按钮,因此这是行不通的。

您还说“单击此按钮时,调用此 Javascript 并传入变量的值id。” 但id在这种情况下没有定义。

如果您只想选择所有复选框,并且不想在全部/未选中之间切换,则此代码应该可以工作:

HTML:

<button id="btnSelect" type="button" onclick="SelectAll" >Select All</button>

在 JavaScript 中:

var gridViewControl = document.getElementById('<%= MyGridView.ClientID %>');

function SelectAll() {
    for (i = 0; i < gridViewControl.elements.length; i++) {
        if (gridViewControl.elements[i].type == "checkbox") {
            gridViewControl.elements[i].checked = true;
        }
   }

}

您根本不需要 c# 代码。

于 2013-03-07T14:48:47.713 回答
1

我建议使用 jQuery 完全在客户端执行此操作。我假设新的 ASP.NET 会按照您命名元素的方式呈现元素的 ID,所以我将使用它们。(我认为 ASP.NET 中有一个设置以这种方式呈现 ID)

在包含 jQuery 之后,您可以将一些示例代码放在 HTML 代码的底部:

<script>
    $("#btnSelect").click(function(event) {
        event.preventDefault();
        $("#MyGridView").find("[type='checkbox']").prop('checked', true);
    });
</script>

这将只选择并检查 GridView 中的复选框,假设 GridView 容器元素的呈现 ID 是“MyGridView”。

于 2013-03-07T15:21:27.030 回答
0

最后我找到了解决方案,并且有效。我稍微修改了@Ann L 的解决方案。

function SelectAll() {

    var frm = document.forms['aspnetForm'];

    for (var i = 0; i < document.forms[0].length; i++) {
        if (document.forms[0].elements[i].id.indexOf('CkBoxSelectIT') != -1) {

                document.forms[0].elements[i].checked = true

        }
    }
}
于 2013-03-11T08:45:53.923 回答
0

我已经这样做了,通过使用在网格内查找输入元素getElementsByTagName("input")。然后迭代并将值设置为选中。

HTML

<asp:CheckBox ID="chkSelectAll" runat="server" onclick="selectAll(this)" />

Javascript

function selectAll(chkAll) {
            var gvrecipe = document.getElementById('<%=gvrecipe.ClientID %>');
            var inputs = gvrecipe.getElementsByTagName("input");
            alert(inputs.length);
            for (var i = 0; i < inputs.length; i++) {
                if (inputs[i].id.indexOf("_chkSelect") != -1)
                    inputs[i].checked = chkAll.checked;
            }
        }
于 2019-06-26T12:29:21.660 回答