啟用或禁用列表框的復選框

Question

我在創建的 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>

Answer 1

因為您使用的是“#allUsersCheck”的 ID 選擇器。 與您的列表框（？）不同，該復選框沒有 Id 屬性。

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

使用 Id 屬性嘗試以下操作：

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

Answer 2

好的。 我花了一段時間才弄清楚我需要做的事情的全部清單。

這就是我為最終讓它工作所做的一切。

1. 首先，我需要使用這個 jquery 庫。

<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>

2. 然后我不得不在上面的 jquery 包含下創建一個 function

<script type="text/javascript">

    $(function () {
        $("#allUsersCheck").change(function () {
            $("#lbUsers").find("option").prop("selected", this.checked)

        });
    });
</script>

在上面您將看到 allUsersCheck 是復選框元素的 id，而 lbUsers 是 ListBoxFor 元素的 id。

3. 接下來是，在 my.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>
 

我還在 model 中使用了 bool 標志。 allUsers 是標志。 controller 代碼中的其他內容需要 bool 標志，而不是出於 UI 原因。

我不確定這是否是最好的方法。 但這是我可以讓它工作的方法。

感謝在這個過程中幫助我完成這項工作的人。 顯然不是沒有他們。