首页 > 解决方案 > 使按钮变灰,直到在下拉列表中选择某个值

问题描述

如果默认的“选择”是此下拉列表中的选定项...

@Html.DropDownListFor(x => x.ID, new SelectList(Model.Data, "ID", "Info"), "Choose",new {@id = "DDL" }})

我希望这个按钮变灰。

 <input name="Submitbtn" type="Submit" id="Submit" value="Submit"/>

我已经在条件内尝试过这个,但它根本没有改变按钮......

$('#DDL').change(function () 
{
       if ($("#DDL option:selected").text() == 'Choose')
        {
              ///which of these?
              $(".Submitbtn").attr('disabled', true);
              $("#Submitbtn").attr("disabled", "disabled");
        }
}

标签: jqueryasp.net-mvc

解决方案


从原始恢复@id=到原始:

@Html.DropDownListFor(x => x.ID, new SelectList(Model.Data, "ID", "Info"), "Choose")

将创建一个

<select id="ID" name="ID">

所以你的jQuery应该是

$("#ID").change(function() { if $(this).text() == "Choose") {...

对于按钮本身,#SubmitBtn必须匹配按钮 id,即Submit(不带 Btn),给出:

$("#Submit").attr("disabled", "disabled");

更新片段:

$('#ID').change(function() {
  if ($("#ID option:selected").text() == 'Choose') {
  
    $("#Submit").attr("disabled", "disabled");

  } else {
  
    $("#Submit").attr("disabled", null);
    
  }
});

// trigger/run on startup to disable as default is Choose
$('#ID').change();
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select id="ID">
  <option>Choose</option>
  <option value="val1">text 1</option>
  <option value="val2">text 2</option>
</select>
<input name="Submitbtn" type="Submit" id="Submit" value="Submit" />


推荐阅读