C# 使用简单的MVC Html.DropDownList控制div、onLoad和onselectChange的可见性

我有以下代码：

<div class="form-group">
    <label class="col-xs-3 control-label">Intermediary Bank Required?:</label>
    <div class="col-xs-9">
        <p class="form-control-static">@Html.DropDownList("IntermediaryRequired",(SelectList)ViewBag.IntermediaryRequired,"NO", new { @class = "form-control" })</p>
    </div>
</div>

我的目标是在两种情况下隐藏/显示一个

，以响应DropDownList中的选定值：

当用户手动更改DropDownList选择时

当表单加载模型字段的现有值时，IntermediaryRequired

---

请告诉我们如何实现这一点。

您应该能够使用一点javascript来实现这一点。收听下拉列表中的

change

事件，检查值并隐藏/显示div。在

文档中执行相同操作。准备好
（页面加载）以及使用模型的现有值

<script type="text/javascript">
$(function(){

  //On page load, update the visiblity
  var v=$("#IntermediaryRequired").val();
  UpdateDivVisibility(v);

  //When user changes the dropdown, update visibility
  $("#IntermediaryRequired").change(function(e){
    var v=$("#IntermediaryRequired").val();
    UpdateDivVisibility(v);
  });

});

function UpdateDivVisibility(isVisible)
{
    if(v=="YES") 
    {
      $("#DivIdtoHide").show();
    }
    else
    {
       $("#DivIdtoHide").hide();
    }
}
</script>

当用户手动更改下拉列表时，可以执行类似操作来显示/隐藏
div

var yourDiv = $('#yourDiv');
$('#IntermediaryRequired').on('change', function(){
    if ($(this).val() == 'YES') {
        yourDiv.show();
    }
    else {
        yourDiv.hide();
    }
});

为了在页面加载时获得相同的结果，您可以尝试

@if (Model.value)
{
    <div id="yourDiv">
       ....
    </div>
}

@if（Model.value）
{
....
}

作为旁注，仅当您想添加段落时才使用
p
，如果您只想添加-mounced-block元素，则可以使用
div
。您可以阅读更多关于语义的内容。
谢谢。请您帮助我了解
@Html.DropDownList（“IntermediaryRequired”）
字段为布尔值时，我需要下拉列表显示是/否。我们如何使用绑定到布尔模型字段IntermediaryRequired的Html.DropDownList实现这一点谢谢。请您帮助我了解
@Html.DropDownList（“IntermediaryRequired”）
字段为布尔值时，我需要下拉列表显示是/否。如何使用绑定到布尔模型字段IntermediaryRequired的Html.DropDownList实现这一点
public ActionResult create()
{
  var vm = new CreateCustomerVM();
  vm.IntermediaryOptions = GetOptions();
  return View(vm);
}
private List<SelectListItem> GetOptions()
{
    return new List<SelectListItem>
    {
        new SelectListItem {Value = "0", Text = "No"},
        new SelectListItem {Value = "1", Text = "Yes"}
    };
}

@model CreateCustomerVM
@using(Html.Beginform())
{
  <div>
   <p>Required?</p>
   <p>@Html.DropdowListFor(s=>s.IntermediaryRequired,Model.IntermediaryOptions)
   <div id="ExtraOptions">
      <!-- Your additional UI elements here -->
   </div>
   <input type="submit" />
  </div>
}

[HttpPost]
public ActionResult Create(CreateCustomerVM model)
{
  //check model.IntermediaryRequired  
 // to do : Save and Redirect(PRG pattern)
}

var yourDiv = $('#yourDiv');
$('#IntermediaryRequired').on('change', function(){
    if ($(this).val() == 'YES') {
        yourDiv.show();
    }
    else {
        yourDiv.hide();
    }
});

@if (Model.value)
{
    <div id="yourDiv">
       ....
    </div>
}