如何在DropDownListFor - MVC上使用javascript将DropDownListFor值更改为空？

Question

我有多个DropDownListFor分配给相同的变量，这些变量是隐藏的，只有当某个无线电按钮用javascript激活时才可见。问题是，如果您更改了一个DropDownListFor的值，然后更改了无线电按钮，那么以前的DropDownListFor的值仍然是活动的，即使是这个值也是不可见的，而且当我提交时，前面的DropDownListFor值就是被传递的值。

有没有一种方法可以在不重新加载页面的情况下将所有DropDownListFor的值返回到javascript中的默认'null‘？

查看代码：

<h3>Tipo de Infraestrutura:</h3>

   <input type="radio" name="selectedLinhaType" id="150KV"/> 150kV <br>
   <input type="radio" name="selectedLinhaType" id="220KV"/> 220KV <br>
   <input type="radio" name="selectedLinhaType" id="400KV"/> 440KV <br>

    <div class ="infobox" id="is150KV">
        <fieldset>
            <h3>Linha 150KV:</h3>
            <p>@Html.DropDownListFor(m => m.SelectedLinha.NumLinha, ViewData["ListLinhas150"] as List<SelectListItem>, "")</p>
        </fieldset>
    </div>
    <div class ="infobox" id="is220KV">
        <fieldset>
            <h3>Linha 220KV:</h3>
            <p>@Html.DropDownListFor(m => m.SelectedLinha.NumLinha, ViewData["ListLinhas220"] as List<SelectListItem>, "")</p>
        </fieldset>
    </div>
    <div class="infobox" id="is400KV">
        <fieldset>
            <h3>Linha 400KV</h3>
            <p>@Html.DropDownListFor(m => m.SelectedLinha.NumLinha, ViewData["ListLinhas400"] as List<SelectListItem>, "")</p>
        </fieldset>
    </div>

Javascript：

    <script type="text/javascript">
    $(document).ready(function () {
        $('#is150KV').hide(); $('#is220KV').hide(); $('#is400KV').hide();
        $('#150KV').change(function () {
            $('#is220KV').hide(); $('#is400KV').hide();
            $('#is150KV').show();
        });

        $('#220KV').change(function () {
            $('#is150KV').hide(); $('#is400KV').hide();
            $('#is220KV').show();
        });

        $('#400KV').change(function () {
            $('#is150KV').hide(); $('#is220KV').hide();
            $('#is400KV').show();
        });
    })
    </script>

编辑:修正了每个DropDownListFor中添加的ids，并在javascript上禁用/启用了‘..attr’。“.prop”也应该有效，但我没有测试它。

谢谢你的帮助。

Answer 1

与其简单地隐藏下拉列表，不如禁用它。禁用的表单元素从未提交过。

$('#is220KV').attr('disabled', true).hide();

相反：

$('#is220KV').attr('disabled', false).show();