根据客户端变量的状态有条件地启用/禁用 @Html.DropDownListFor

Conditionally enabling/disabling a @Html.DropDownListFor based on the state of a client-side variable

本文关键字：启用 禁用 @Html DropDownListFor 有条件 客户端 变量 状态      更新时间：2023-09-26

我有一个这样的下拉列表 -

    <tr>
       <td>@Html.Label("Data Set")
        </td>
        <td>               
       @Html.DropDownListFor(model => model.SelectedID,tDataSetNames,new{id="DataSetDDL"})
        </td>
    </tr>

现在，"tDataSetNames"是一个列表，使用服务器端方法在此页面顶部进行评估 

@{
    List<SelectListItem> tDataSetNames=RDMUtility.GetDataSets();
 }

必须根据此页面上客户端（javascript 变量）的值有条件地启用或禁用此下拉列表。

如何实现这一点？

像这样：

如果选中，我放了一个checkbox，禁用选择元素，否则启用

$("#myCheckbox").on("change", function (){
  if ($("#myCheckbox").is(":checked"))
      $("#DataSetDDL").prop("disabled", true);
  else
      $("#DataSetDDL").prop("disabled", false);
    
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="DataSetDDL">
  <option value="">select</option>
  <option value="1">1</ption>
  <option value="2">2</ption>
</select>
<input type="checkbox" id="myCheckbox">disable select

或者按照@Tieson T.的建议使用更少的代码：

$("#myCheckbox").on("change", function (){
      $("#DataSetDDL").prop("disabled", $(this).is(":checked"));    
})
相关文章：