0

嗨,我有 gridview,它可以很好地显示所有列和数据。问题是标题中有一个复选框,单击该复选框时假设使用 jquery 选中所有行中的复选框。但是,当我单击标题复选框时,网格行中的其余复选框不会选中。有一些错误我无法弄清楚为什么当我选择标题复选框时它不会选择所有行中的其余复选框。请让我知道错误在哪里。

 <% @page language="C#" masterPageFile="~/first.master" %>
    <asp:Content ID="xContent" ContentPlaceHolderID="xMainContentContainer" Runat="Server">
        <script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>
            <script type="text/javascript" language="javascript">
                $("#<%=GridView3.ClientID%> input[id*='chkAll']:checkbox").click(function () {
                    if ($(this).is(':checked'))
                        $("#<%=GridView3.ClientID%> input[id*='chkEmployee']:checkbox").attr('checked', true);
        else
            $("#<%=GridView3.ClientID%> input[id*='chkEmployee']:checkbox").attr('checked', false);
                });          
        </script>

       <h1 class="title" id="page-title">Gridview Page</h1>       
       <form id="Form" runat="server">
            <asp:GridView ID="GridView3" runat="server" AutoGenerateColumns="False"
                BackColor="#DEBA84" BorderColor="#DEBA84" BorderStyle="None" BorderWidth="1px"  CellPadding="3" CellSpacing="2">
                <Columns>
                 <asp:TemplateField>
                <HeaderTemplate>
                    <asp:CheckBox runat="server" ID="chkAll" />
                </HeaderTemplate>
                <ItemTemplate>
                    <asp:CheckBox runat="server" ID="chkEmployee" />
                </ItemTemplate>
            </asp:TemplateField>
                    <asp:TemplateField HeaderText="Id">
                        <ItemTemplate>
                            <asp:Label ID="Id" runat="server" Text='<%# Eval("Id") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                    <asp:TemplateField HeaderText="Company">
                        <ItemTemplate>
                            <asp:Label ID="lblCompany" runat="server" Text='<%# Eval("Company") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                     <asp:TemplateField HeaderText="Location">
                        <ItemTemplate>
                            <asp:Label ID="lblLocation" runat="server" Text='<%# Eval("Location") %>'></asp:Label>
                        </ItemTemplate>
                    </asp:TemplateField>
                </Columns>
            </asp:GridView>
        </form>
    </asp:Content>
4

3 回答 3

0

如果你想编写自己的 jquery 位来处理这个问题,你可以这样做:

// select your 'all' checkbox
$('input.all').on('click', function(){
   $('input[type="checkbox"]').prop('checked', this.checked);
});
于 2013-07-24T19:59:32.630 回答
0

您想测试是否chkAll通过使用this.Checked而不是$(this).is(':checked').

$(document).ready(function (){
    $("#<%= GridView1.ClientID %> input[id*='chkAll']").click(function() {
        $("#<%= GridView1.ClientID %> input[id*='chkEmployee']").attr('checked', this.checked);
    });
});
于 2013-07-24T20:32:07.943 回答
0

选中和取消选中所有行。试试这个

 function selectAll(checked) {
        var isChecked = $(checked).attr('checked') ? true : false;
        if (isChecked) {
            $('input:checkbox[name$=chkEmployee]').each(
                    function () {
                        $(this).attr('checked', 'checked');
                    });
        }
        else {
            $('input:checkbox[name$=chkEmployee]').each(
                    function () {
                        $(this).removeAttr('checked');
                    });
        }
    }

并像这样添加 onclick 事件

  <HeaderTemplate>
   <asp:CheckBox runat="server" ID="chkAll"  onclick="selectAll(this);" />
  </HeaderTemplate>
于 2013-07-25T04:15:57.443 回答