c# - 根据另一个 DropDownList 的选择动态填充 DropdownList

Question

我需要能够根据先前 DropDownList 的选择来填充 DropDownList。

我注意到在 SO 上有很多类似的主题，不幸的是，我需要在不使用 AJAX 调用的情况下完成此操作，并且需要在 MVC5 中完成而不进行回发(如果可能)。

1. 这可能吗？
2. 我从哪里开始？有没有我可以借鉴的例子？

Answer 1

实际上，没有 AJAX 也可以做到这一点，但仍然需要一些 Javascript:

第一个和第二个下拉菜单都应该有所有可用的选项预渲染。对于第二个下拉列表中的每个选项，指定该选项应该对第一个下拉列表的哪个值可见。例如:

<select id="firstDd">
   <option value="car">Cars</option>
   <option value="plane">Planes</option>
</select >


<select id="secondDd">
   <option value="ferrari" data-display-on="car">Ferrari</option>
   <option value="bugatti" data-display-on="car">Bugatti</option>
   <option value="747" data-display-on="plane">Boeing 747</option>
   <option value="757" data-display-on="plane">Boeing 757</option>
</select >

现在使用一些简单的 javascript，您可以根据第一个下拉选项的值切换第二个下拉选项的可见性:

$('#firstDd').change(function(){
  var value = $(this).val();
  if(value)
  {
    var $secondDd = $('#secondDd');
    var $selectedOption = $('option:selected', $(this));
    $('option', $secondDd).hide();
    $('option[data-display-on="'+value+'"]',$secondDd).show();    
  }
  $($secondDd).val(null);
})

$('#firstDd').change();

这里是 working JSFiDDLE证明了这种方法