Asp.net 使用 jQuery 启用/禁用 checkboxList答案

【问题标题】：Asp.net enable/disable checkboxList with jQueryAsp.net 使用 jQuery 启用/禁用 checkboxList
【发布时间】：2015-09-25 08:59:32
【问题描述】：

我有这种结构：

单选按钮：

o 启用 o 禁用

复选框

[]复选框1

[]复选框2

[]复选框3

[]复选框4

以上控件是动态生成的。

<asp:RadioButtonList runat="server" ID="rbSubsidiaries" onclick = "Radio_Click()"/>

 <asp:CheckBoxList runat="server" ID="cblSubsidiaries" Enabled="False"/>

我想要的是：当用户点击 RadioButton Enable时，所有的复选框都启用，否则禁用。

如果用户单击了启用单选按钮，我可以看到这一点。

 function Radio_Click() {
 if ($('#<%=rbSubsidiaries.ClientID %> input:checked').val() == 'enable') {
            alert('enable is clicked');
}
}

但我不知道如何启用所有复选框。

包含 CheckBoxList 的呈现结构的图片。前两个复选框。

【问题讨论】：

标签： javascript c# jquery asp.net

【解决方案1】：

试试这样的：

$("#cblSubsidiaries > input[type='checkbox']").prop("disabled", false)

更新：

$("#contentpage_0_content_0_cblSubsidiaries input[type=checkbox]").prop("disabled",false)

【讨论】：

你能展示一下 CheckBoxList 的渲染结构吗？
谢谢@Bubavanhalen :)

【解决方案2】：

这是可以帮助你的代码

HTML

<input type="radio" name="check" value="enable" class="enableList">Enable
    <input type="radio" name="check" value="disable" class="disableList">Disable    

<div class="container">
 <input type="checkbox" name="vehicle" value="Bike">I have a bike<br>
 <input type="checkbox" name="vehicle" value="Car">I have a car </div>

脚本

$(document).ready(function () {           
        $('.enableList').change(function () {
            if ($(this).prop('checked') == true) {
                $('.container').find('input:checkbox').each(function () {
                    alert ("enable check box");
                });
            }
        });


        $('.disableList').change(function () {
            if ($(this).prop('checked') == true) {
                $('.container').find('input:checkbox').each(function () {
                    alert("disable check box");
                });
            }
        });

    });

这是工作提琴手 https://jsfiddle.net/Ln7y6v0n/

【讨论】：

【解决方案3】：

这样的事情应该可以工作：

$('#contentpage_0_content_0_cblSubsidiaries input[type=checkbox]').each(function() {
      $(this).prop('checked', true);
 });

【讨论】：

【解决方案4】：

 $(document).ready(function () {

            $('#<%=RadioButtonList1.ClientID%>').change(function () {
                 $('#<%=RadioButtonList1.ClientID%>').each(function () {
                     var checked = $(this).find('input:radio:checked');
                     if (checked.val() == "Enable") {

                         $('#<%=CheckBoxList1.ClientID%>').each(function () {
                             var checked = $(this).find('input:checkbox');
                             checked.prop('checked', true);
                         });
                     }
                     else {

                         $('#<%=CheckBoxList1.ClientID%>').each(function () {
                             var checked = $(this).find('input:checkbox');
                             checked.prop('checked', false);
                         });
                     }
                 });
             });
        });

 protected void Page_Load(object sender, EventArgs e)
        {
            ListItem item = new ListItem();
            item.Text = "Enable";
            item.Value = "Enable";
            RadioButtonList1.Items.Add(item);

            ListItem item1 = new ListItem();
            item1.Text = "Disable";
            item1.Value = "Disable";
            RadioButtonList1.Items.Add(item1);

            for (int i = 1; i <= 4; i++)
            {
                ListItem chkitem = new ListItem();
                chkitem.Text = "Checkbox" + i;
                chkitem.Value = "Checkbox" + i;
                CheckBoxList1.Items.Add(chkitem);
            }

        }

 <div>
            <asp:RadioButtonList ID="RadioButtonList1" runat="server"></asp:RadioButtonList>
            <br />
            <hr />
            <asp:CheckBoxList ID="CheckBoxList1" runat="server"></asp:CheckBoxList>
        </div>

【讨论】：