在listview（asp.net）中通过Jquery检查了所有复选框答案

【问题标题】：Checked all the checkbox by Jquery in listview (asp.net)在listview（asp.net）中通过Jquery检查了所有复选框
【发布时间】：2018-08-15 15:13:19
【问题描述】：

我有一个 Listview，里面有转发器，列表视图像手风琴一样显示，有一个复选框，我想在单击 chkSelectAll 时选中转发器中的所有框。

enter code here
   <asp:ListView ID="lstSecurityFunction" runat="server"
       OnItemDataBound="lstSecurityFucntion_OnItemDataBound">
       <LayoutTemplate>
           <ul class="nav-accordion nav-roles" style="display: block;">
               <li runat="server" id="itemPlaceholder"></li>
           </ul>
       </LayoutTemplate>
       <ItemTemplate>
           <li>
               <span class="opener" runat="server" id="liModuleName">
                   <asp:CheckBox runat="server" ID="chkSelectAll" onClick="if($(this).is(':Checked'))isClick(this);"
                       moduleId='<%#Eval("ModuleID") %>' />
                   <asp:Label runat="server"> <%#CurrentLanquage==CspPortal.CspService.NotificationLanguages.English?Eval("EnModuleName"):Eval("ArModuleName")%></asp:Label>
                   <asp:HiddenField runat="server" Value='<%#Eval("ModuleID") %>' ID="hdnModuleId"></asp:HiddenField>
                   <i class="fa fa-angle-down"></i><i class="fa fa-angle-up"></i>
               </span>

               <div class="row">
                   <asp:Repeater ID="rpSecurityFunction" runat="server">
                       <ItemTemplate>
                           <div class="col-md-3" id="list" runat="server">
                               <asp:HiddenField ID="hdnData" runat="server" />
                               <asp:CheckBox ID="cbSecruityFunction" runat="server"

                                   fucntionId='<%# Eval("FunctionID") %>'
                                   name="reason" />
                           </div>
                       </ItemTemplate>
                   </asp:Repeater>
               </div>
           </li>
       </ItemTemplate>
   </asp:ListView>

我写这个jquery代码

<script> function isClick(s) {
    $(".nav-roles li ").find("input[id*='chkSelectAll']").each(function () {
    var isChecked =$(this).attr("checked");
           if (this.checked) {

               $('.nav-roles li .row .col-md-3').find("input[id*='cbSecruityFunction']").each(function () {
                   $(this).prop('checked', true);
               });}
       });
} </script>

【问题讨论】：

标签： jquery asp.net checkbox

【解决方案1】：

试试这个：您必须注册更改事件处理程序以选择所有复选框，并根据所有其他复选框的值进行选中/取消选中

请注意，您有其他复选框的重复 ID，这可能会在使用 javascript 或 jquery 时产生问题。你需要改变它。我使用名称选择了其他复选框。

$(document).ready(function(){
    $(document).on('change',".nav-roles li span.opener input[type=checkbox]", function () {
        var isChecked =$(this).is(":checked");
        var $li = $(this).closest('li'); // get li parent
        $li.find('div.row input[type=checkbox]').prop('checked', isChecked); //find all other checkboxes and set check or uncheck
     });
});

【讨论】：

它应该在文档中准备好，因为它将确保 DOM 正确加载并将其从点击功能中删除，因为它不是必需的
我试过了，但不行，如果我改变 chkSelectAll 什么都不会发生，
里面有listview和repeater
是 chkSelectAll 是整个页面的唯一 id 吗？如果没有，那么它就不起作用，你需要让它独一无二或给它一些类
chkSelectAll 是列表视图中的一个复选框，（意味着它是生成的）所以它不是唯一的

【解决方案2】：

我使用了一个 jQuery 手风琴，所以它可以使用它

  $(document).ready(function () {

        $('.nav-roles li span.opener .chk-area').on('click', function () {
            var isChecked = $(this).hasClass("chk-checked");
            if (isChecked) {
                var $li = $(this).closest('li'); // get li parent
                $li.find('div.row input[id*="cbSecruityFunction"]').each(function() {
                    $(this).prev().removeClass("chk-checked");
                    $(this).parent().removeClass("active");
                    $(this).prev().addClass("chk-unchecked");
                    $(this).next().removeClass("chk-label-active");
                    $(this).prop("checked", false);
                });
            } else {
                var $li = $(this).closest('li'); // get li parent
                $li.find('div.row input[id*="cbSecruityFunction"]').each(function () {
                    $(this).prev().removeClass("chk-unchecked");
                    $(this).prev().addClass("chk-checked");
                    $(this).parent().addClass("active");
                    $(this).next().addClass("chk-label-active");
                    $(this).prop("checked", true);
                });
            }

        });

【讨论】：