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

すべての行をチェックおよびチェック解除します。これを試して

 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 に答える
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 に答える