Mvc下拉列表不起作用

Posted 2023-02-24

【中文标题】Mvc下拉列表不起作用

【英文标题】：Mvc DropdownList Not working

【发布时间】：2016-10-22 23:34:28

【问题描述】：

问题描述：

选择后的下拉列表不显示列表中的选定文本。

这里我使用 MVC Razor 语法来生成下拉列表框。

  <div class="form-group">
            @html.LabelFor(m => m.Genre)
            @Html.DropDownListFor(m => m.Genre, 
                                  new SelectList(Model.Genres, "Id", "Name"),
                                  "---Select---", new  @class = "form-control" )
            @Html.ValidationMessageFor(m => m.Genre)
    </div>

列表已正确填充，但在选择选项后它未显示在下拉列表框中。

注意：当我提交表单时，正确选择的值将被发送到操作。

检查步骤：

检查生成的 HTML 看起来没问题..

它使用引导表单控制类，颜色设置为黑色。其他字段值也会显示在同一表单内。

浏览器计算选项卡

提前致谢..

更新解决方案：

我已经为我的表单控件类定义了一些覆盖导致问题的文本间距。 我在想颜色是问题，但实际上问题是我的文本填充。

.form-control 
    font-size: 17px;
    /*padding: 20px 15px;*/  /*this statement caused issue*/
    border-radius: 9px; 
    height:42px; /* I replaced with padding to height which solved issue.*/

【问题讨论】：

您的 html 已正确生成并正确回发，因此表明这是一个 css 问题

我认为这可能是 Css 问题。不确定找到最重要的 CSS 的方法。但我尝试添加 select#Genre.form-control.valid color : black !important; 它没有用。

使用浏览器工具检查元素及其样式

我也检查了计算选项卡。颜色设置为黑色。

您是否检查过没有其他元素可能会掩盖它。你有 javascript/jquery 吗？

【参考方案1】：

我已经为我的表单控件类定义了一些覆盖导致问题的文本间距。我在想颜色是问题，但实际上问题是我的文本填充。

.form-control 
    font-size: 17px;
    /*padding: 20px 15px;*/  /*this statement caused issue*/
    border-radius: 9px; 
    height:42px; /* I replaced with padding to height which solved issue.*/

【参考方案2】：

对不起，我来晚了。 但是，只有在平板电脑的工具上将配置更改为 PC 版本时，下拉列表才能正常工作