【问题标题】:Checkbox to enable or disable a list box启用或禁用列表框的复选框
【发布时间】:2020-11-14 03:06:58
【问题描述】:

我创建的 ASP.NET MVC 页面上有一个复选框,如下所示:

<div>
    @Html.CheckBoxFor(m => m.allUsers, new { Name = "allUsersCheck" })
    @Html.LabelFor(m => m.allUsers)
</div>

我还创建了一个列表框:

@Html.ListBoxFor(x => x.selectedUsers, Model.ListofUsers, new { style = "width:200px", size = 10, Id = "lbUsers" })

我有以下脚本(我写这个脚本是为了在我的复选框被选中时禁用列表框。我不明白为什么它不起作用。有人能指出我的代码有什么问题吗?

此脚本在同一个 .cshtml 页面中,而不是在 .js 文件中:

<script >

    $(function () {
        $('#allUsersCheck').click(function () {
            $('#lbUsers').prop("disabled", $(this).prop('checked'));
        });
    });

</script>

【问题讨论】:

    标签: javascript html asp.net-mvc checkboxfor html.listboxfor


    【解决方案1】:

    因为您使用的是“#allUsersCheck”的 ID 选择器。与您的列表框(?)不同,该复选框没有 Id 属性。

    @Html.CheckBoxFor(m => m.allUsers, new { Name = "allUsersCheck" })
    

    使用 Id 属性尝试以下操作:

    @Html.CheckBoxFor(m => m.allUsers, new { Name = "allUsersCheck", Id = "allUsersCheck" })
    

    【讨论】:

    • 其实没用。我像你说的那样尝试过,并且还删除了 Name 属性。都没有用。
    • 没有消息.. 但它也没有启用或禁用列表框。它编译并运行没有错误。只是为了确定,这些错误会显示在哪里?不在我能看到的浏览器中
    • 多么蹩脚我不得不包含这样的东西
    • 我也不得不使用 id 而不是 Id
    【解决方案2】:

    好的。我花了一段时间才弄清楚我需要做的所有事情。

    这就是我为最终让它工作所做的一切。

    1. 首先,我需要使用这个 jquery 库。
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
    
    1. 然后我不得不在上面的jquery包含下创建一个函数
    <script type="text/javascript">
    
        $(function () {
            $("#allUsersCheck").change(function () {
                $("#lbUsers").find("option").prop("selected", this.checked)
    
            });
        });
    </script>
    

    在上面你会看到 allUsersCheck 是 checkbox 元素的 id,lbUsers 是 ListBoxFor 元素的 id。

    1. 接下来是,在我的 .cshtml 中,我需要使用/创建 listboxfor / checkbox 元素。我就是这样做的
          <b>Users </b><br />
          @Html.ListBoxFor(x => x.selectedUsers, Model.ListofUsers, new { style = "width:200px", size = 10, id = "lbUsers" })
          <br />
    
    
          <div>
               @Html.CheckBoxFor(m => m.allUsers, new { id = "allUsersCheck" })
               @Html.LabelFor(m => m.allUsers)
          </div>
     
    

    我还在模型中使用了 bool 标志。 allUsers 是标志。控制器代码中的其他内容需要 bool 标志,而不是出于 UI 原因。

    我不确定这是否是最好的方法。但这是我可以让它发挥作用的方法。

    感谢在这个过程中帮助我完成这项工作的人。显然不是没有他们。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2012-08-12
      • 1970-01-01
      • 1970-01-01
      • 2017-01-20
      • 2019-06-02
      • 1970-01-01
      相关资源
      最近更新 更多