Mvc Dropdownlist 选择器未显示答案

【问题标题】：Mvc Dropdownlist Select picker not showingMvc Dropdownlist 选择器未显示
【发布时间】：2017-08-09 09:58:00
【问题描述】：

我很确定这可能是我需要的一些脚本参考，但这是我目前所拥有的。

我的脚本：

    script src="~/scripts/jquery-3.1.1.js"></script>


<script src="~/Scripts/knockout-3.4.2.js"></script>
<script src="~/Scripts/moment.js"></script>
<script src="~/Scripts/knockout.mapping-latest.js"></script>
<script src="~/Scripts/bootstrap-select.min.js"></script>
<script type="text/javascript">


    $(document).ready(function () {
        $(".selectpicker").selectpicker({
            liveSearch: true,
            showSubtext: true
        });
    });
</script>

在此之后使用 Knockout 加载对象。

我的 CSS：

<link rel="stylesheet" href="~/Content/bootstrap-select.min.css">

和正常的引导程序。

这是我的下拉菜单：

 <td><u>persons</u><br />@Html.DropDownList("PersonId", (SelectList)ViewBag.PersonId, "Choose the person you want.", htmlAttributes: new
                           {
                               @class = "selectpicker",
                               data_show_subtext = "true",
                               data_live_search = "true"
                           })

如果我检查页面，我可以找到带有正确选项的选择，但不会显示在页面上，除非我删除“Selectpicker”类，有什么建议可以解决这个问题吗？

谢谢。

【问题讨论】：

标签： c# asp.net razor bootstrap-selectpicker

【解决方案1】：

你需要在 chrome 开发者工具上检查这个元素的计算属性是什么，你可能会发现这个类有另一个实现隐藏它。

查看计算的属性：

在 google chrome 上打开开发者工具（f12 或检查所需元素上的元素）
在元素选项卡上选择要检查的元素
从开发人员工具的右窗格中选择“计算”选项卡

在那里你会找到计算的 CSS 属性列表，如果你点击任何属性，它会打开这个实现的位置

希望对你有帮助

【讨论】：

感谢您的快速回复，但我一直未能找到错误。
有趣的是我在其他页面上有完全相同的代码。相同的布局和一切。它在那里工作。我认为这可能与淘汰赛有关
好的，我发现了错误。这是因为它在脚本文本/html 标记内。一旦我把它搬出去，它就起作用了。但我需要它在里面。所以必须为此找到解决方案。
为什么要把它放在那里？ “text/html”脚本是模板，不会被页面渲染
因为我在创建新对象或编辑对象时使用模板。你还建议我怎么做呢？

【解决方案2】：

我也遇到了同样的情况，下面的代码没有渲染：

<div class="field"> <label for="title">Title</label> @Html.DropDownList("TitleList", new SelectList(Model.claimantTitles, "TitleId", "Title"), "--Select Title--", new { @class = "dropdown-menu", @arialabelledby = "dropdownlabel" }) </div>

我删除了：@class = "dropdown-menu"，它起作用了

【讨论】：