在检查子复选框时，父母不检查反之亦然工作完美答案

【问题标题】：on checking the child checkbox parent does not checked vise versa Works perfectly在检查子复选框时，父母不检查反之亦然工作完美
【发布时间】：2015-12-21 05:18:17
【问题描述】：

嗨，当我单击父复选框时，我在asp.net repeater 中有这些复选框，正如您在此 picture 中看到的那样，所有子复选框都会被选中，另一方面，当我选中子复选框时，父复选框没有被选中。我正在使用Jquery 来实现这一点我当前的ASP.NET 代码如下所示

<ul id='<%# "p_"+Eval("ApplicationId") %>' class="child-ul-hide child-ul">
                                                    <asp:Repeater ID="rptrPages" runat="server" OnItemDataBound="rptrPages_ItemDataBound">
                                                        <ItemTemplate>
                                                            <li>
                                                         <%-- <span id='<%# "sp_"+Eval("PageId") %>' class="parent arrow-right" state="hide"></span>--%>
                                                                <asp:Label ID="lblSpaces" runat="server" Text='<%# Eval("Spaces") %>'></asp:Label>
                                                                <asp:Literal ID="ltrArrowSpan" runat="server"></asp:Literal>
                                                                <label>
                                                                    <asp:CheckBox ID="chkPage" runat="server" Text='<%# Eval("PageTitle") %>'
                                                                        CssClass='<%# "page Pid_"+ Eval("ParentId")%>' PageId='<%# Eval("PageId") %>' ParentId='<%# Eval("ParentId") %>'
                                                                        Checked='<%# Eval("IsEnable")== null ? false: Convert.ToBoolean(Eval("IsEnable").ToString())  %>' />
                                                                </label>
                                                                <asp:HiddenField ID="hdPageId" runat="server" Value='<%# Eval("PageId") %>' />

我的JavaScript 代码如下正如你所看到的，我尝试了其他一些东西，并且也使用了 Intermediate snippiest，但是当他们被邀请到ASP.NET 时，一切都没有按计划进行。你们中的许多人可能会建议使用<input type='checkbox'/> 抱歉我不能这样做

$(document).ready(function () {

        /* Hide Show Tree lis
         *******************************************/
        $(".parent").click(function () {

            var ID = $(this).attr("id");
            var state = $("#" + ID).attr("state");
            if (state == "hide") {

                $("#" + ID).attr('state', 'show');
                $("#" + ID).addClass("arrow-down").removeClass("arrow-right");
                ID = ID.replace("s", "");
                $("#" + ID).addClass("child-ul-show").removeClass("child-ul-hide");
            }
            else {

                $("#" + ID).attr('state', 'hide');
                $("#" + ID).addClass("arrow-right").removeClass("arrow-down");
                ID = ID.replace("s", "");
                $("#" + ID).addClass("child-ul-hide").removeClass("child-ul-show");
            }
        });

    //    /* START Parent Enable CheckBox Click Event
    //   *********************************************/
        $(".page input[type='checkbox']").click(function() {

            var PageId = $(this).parent('.page').attr("PageId");

            var parentId = $(this).parent('.page').attr("ParentId");

            var EnableStatus = $(this).prop("checked");

            // Check/ Uncheck Controls Checkboxes
            $("." + PageId + " input[type='checkbox']").prop('checked', EnableStatus);

            //Check unCheck Childs Checkboxes
            $(".Pid_" + PageId + " input[type='checkbox']").prop('checked', EnableStatus);


            $(".Pid_" + PageId + " input[type='checkbox']").each(function() {
                PageId = $(this).parent('.page').attr("PageId");
                EnableStatus = $(this).prop("checked");
                $(".Pid_" + PageId + " input[type='checkbox']").prop('checked', EnableStatus);
            });

            //$(".page input[type='checkbox']").prop('checked', false);
            //$(".Pid_" + ParentId + " input[type='checkbox']").each(function() {
            //    debugger;
            //    EnableStatus = $(this).prop("checked");
            //    if (EnableStatus) {
            //        $(".page input[type='checkbox']").prop('checked', EnableStatus);
            //        return false;
            //    }
            //});
            debugger;
            parentId = parseInt(parentId);
            if (parentId>0) {
                $("input[type='checkbox'][ParentId^='" + parentId + "']").prop('checked', true);

            }


            /*/ */
            //$('input[name=' + parentId + '][value=Done][type=checkbox]:not(:checked)').attr({
            //    checked: 'checked',
            //    disabled: 'disabled'
            //});



        });

【问题讨论】：

一个好办法是将你的 html output 作为 asp.net 页面生成的，并与 javascript 一起将它作为可运行的 javascript/html 嵌入到你的问题中sn-p。这会将您的特定问题与您的应用程序的其他部分区分开来......更重要的是，这将使其他人更容易提供帮助。

标签： javascript c# jquery asp.net webforms

【解决方案1】：

我可以看到的是，您有一个复选框，它一次充当父母和孩子，我不知道是什么让您这样做。让我们来寻找答案。
将属性添加到类中 ParentId='<%# Eval("ParentId") 获取该属性

                var ParentId = $(this).parent('.page').attr("ParentId");

使用 JavaScript parseInt 将您的 id 解析为整数而不是这样做

   ParentId= parseInt(ParentId);
            if (ParentId > 0) {

                $(".p_" + ParentId + " input[type='checkbox']").prop('checked', false);
                $(".Pid_" + ParentId + " input[type='checkbox']").each(function () {

                    EnableStatus = $(this).prop("checked");
                    if (EnableStatus)
                    {
                        $(".p_" + ParentId + " input[type='checkbox']").prop('checked', EnableStatus);
                    }

                });
            }

希望对你有帮助

【讨论】：