CheckBox检查所有子checkBox

Question

我只想检查所有的子checkBox，当父母是检查和取消检查，当父母是取消检查。

THX

<div class="modal-body">

            @for (int i = 0; i < Model.Count; i++)
            {
                @Html.HiddenFor(m => Model[i].Id)
                <div id="@Model[i].Name" class="row" style="width:300px;">
                    <div>
                        <span data-toggle="collapse" class="glyphicon glyphicon-chevron-down" data-target="#@Model[i].Id"> </span>
                        @Html.Label(Model[i].Name + "("+ (Model[i].LicensesTotal - Model[i].LicensesUsed).ToString()+"/" + Model[i].LicensesTotal.ToString()))


                        @Html.CheckBoxFor(x => Model[i].Assigned, new { @class = "pull-right",  @id = @Model[i].Name.ToString() })
                    </div>
                    <div id="@Model[i].Id" class="collapse">


                        @for (int i2 = 0; i2 < Model[i].Plans.Count; i2++)
                        {
                            <div>
                                <div>
                                    @Html.Label(Model[i].Plans[i2].Name)
                                    @Html.CheckBoxFor(x=> Model[i].Plans[i2].Assigned, new { @class = "pull-right" })
                                </div>
                            </div>
                        }
                    </div>
                    <hr/>
                </div>

            }

</div>

Answer 1

向父复选框中添加一个特殊类，如下所示

 @Html.CheckBoxFor(x => Model[i].Assigned, new { @class = "pull-right parent",  @id = @Model[i].Name.ToString() })

那么你的代码是，

$(".parent").change(function() {
  $(this).closest(".row").find(".collapse :checkbox").prop("checked", this.checked);
});

• 使用row找到具有类closest(".row")的父div
• 使用.find(".collapse :checkbox")获取div折叠中的所有复选框(查找将搜索子元素)