ASP.net MVC中基于Dropdown的数据字段选择答案

【问题标题】：Data Field Select Based on Dropdown in ASP.net MVCASP.net MVC中基于Dropdown的数据字段选择
【发布时间】：2020-08-03 04:58:30
【问题描述】：

我的数据库中有 2 个不同的字段，分别名为 ID1 和 ID2；并在我的视图中有一个带有 ID1 和 ID2 的下拉列表可供选择。

我的要求是，如果用户在下拉列表中选择 ID1，那么 ID1 的文本字段应该填充/可见，如果用户选择 ID2，那么 ID2 的文本应该是可见的

我尝试在我的模型类中创建一个选择列表，以为我可以在我的控制器类中编写条件，但是在尝试在视图中调用它时遇到了问题。

有没有办法让这种情况直接在我的视图中起作用？

查看：

<select id="taxid" style="width:10%">
            <option value="id1">ID1</option>
            <option value="id2">ID2</option>
        </select>
@Html.TextAreaFor(Model => Model.ID1, new { style = "width:50%; border-color: grey"})
@Html.ValidationMessageFor(Model => Model.ID1)
@Html.TextAreaFor(Model => Model.ID2, new { style = "width:50%; border-color: grey"})
@Html.ValidationMessageFor(Model => Model.ID2)

有人可以帮我解决这个问题吗？谢谢

【问题讨论】：

标签： c# html css asp.net asp.net-mvc

【解决方案1】：

我能够使用 jquery 解决我的问题。我添加了一个额外的字段，它将隐藏 2 个必需选项。我将两个输入字段分成 2 个不同的部分。然后我编写了执行所需条件的 jquery 代码。

查看：

<select id="taxid" style="width:10%;">
                <option>Select TaxID Type</option>
                <option value="id1">ID1</option>
                <option value="id2">ID2</option>
            </select>
            <div id="feinfield">
                @Html.TextAreaFor(Model => Model.ID1, new { style = "width:50%; border-color: grey" })
                @Html.ValidationMessageFor(Model => Model.ID1)
            </div>
            <div id="ssnfield">
                @Html.TextAreaFor(Model => Model.ID2, new { style = "width:50%; border-color: grey" })
                @Html.ValidationMessageFor(Model => Model.ID2)
            </div>

jquery

<script>
        $(function () {
            $('#id1field').hide();
            $('#taxid').change(function () {
                if ($('#taxid').val() == 'id1') {
                    $('#id1field').show();
                } else {
                    $('#id1field').hide();
                }
            });
        });

        $(function () {
            $('#id2field').hide();
            $('#taxid').change(function () {
                if ($('#taxid').val() == 'id2') {
                    $('#id2field').show();
                } else {
                    $('#id2field').hide();
                }
            });
        });
    </script>

如果您对我的解决方案有任何疑虑/疑问，请告诉我。

【讨论】：