2

ヘッダーのチェックボックスをクリックすると、GridView が表示されます。ItemTemplate のすべての CheckBox をチェックしたい。

Jquery で実装しようとしましたが、うまくいきませんでした。

 $(document).ready(function () {
        $('#<%=ChkSelectAll.ClientID %>').click(function () {
            $('#<%=ChkSelectAll.ClientID %>').is(":checked")(function () {
                $('#<%=ChkSelect.ClientID %>').prop('checked', true);
            });
        });
    });

私はGridviewを持っています

<Columns>
            <asp:TemplateField HeaderStyle-Width="20px">
                <HeaderTemplate>
                    <asp:CheckBox ID="ChkSelectAll" runat="server"  />
                </HeaderTemplate>
                <ItemTemplate>
                    <asp:CheckBox ID="ChkSelect" runat="server" />
                </ItemTemplate>
            </asp:TemplateField>
</Column>

ご協力ありがとうございます。

4

4 に答える 4

6

IDは一意でなければならないため、IDの代わりにクラスを使用するよりも多くのチェックボックスがある場合は、このフィドルを確認してください。

$('#ChkSelectAll').click(function () {
if($(this).is(":checked")){
    $('.ChkSelect').prop('checked', true);
}
});

フィドルで編集されたコード

$('#ChkSelectAll').click(function () {
  if($(this).is(":checked")){
    $('.ChkSelect').prop('checked', true);
  }else{
    $('.ChkSelect').prop('checked', false);
  }
});
于 2012-12-29T06:54:29.017 に答える
2 
$("#ChkSelectAll").click(function(){
if($(this).is(":checked")){
$('#ChkSelect').attr('checked', true);
}
else{
$('#ChkSelect').attr('checked', false);
}
}
于 2012-12-29T07:04:20.690 に答える
1

グリッドビューには各行の一意の ID があるため、単一の ID を使用してすべてを変更することはできません。

変化する

$('#<%=ChkSelect.ClientID %>').prop('checked', true);

に

$('[id*=ChkSelect]').prop('checked', true);

コードを短くすることができます。

$(document).ready(function () {
      $('#<%=ChkSelectAll.ClientID %>').click(function () {           
            $('[id*=ChkSelect]').prop('checked', this.checked);           
      });
});
于 2012-12-29T06:47:33.487 に答える
0

ここのstackoverflowで見つかったいくつかのソリューションを試しましたが、どれも機能しませんでした。jquery-1.9.1.min.js と chrome を使用してテストしました。これが私の実用的なソリューションです

$(document).ready(function() {
  $('#goOffline').click(function(event) {
    if($('#goOffline').is(':checked')){
        $('#goOffline').attr("checked","checked");
    } else {
        $('#goOffline').removeAttr("checked");
    }
});

});

基本的に何が起こるかは、クリックイベントで $('#goOffline') を使用してチェックボックス要素を選択することです。次に、チェックされているかどうかをテストします。チェックされている場合は、アタッチ属性がチェックされているよりも、そうでない場合は、チェックされている属性を削除します。私のhtml入力マークアップは次のようになっていることに注意してください。

<label for="goOffline" class="checkbox">
<input type="checkbox" name="goOffline" id="goOffline">
    Go offline
</label>
于 2013-07-25T06:21:02.983 に答える