尝试在 MVC 5 Razor 页面中实现 bootstrap.chosen

Tring to implement bootstrap.chosen in MVC 5 Razor Page

我已经在我的 web 项目中安装了 bootstrap.chosen 并且正在尝试实现它。

捆绑配置

    bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                "~/Scripts/jquery-{version}.js",
                "~/Scripts/chosen.jquery.js"));

    bundles.Add(new StyleBundle("~/Content/css").Include(
              "~/Content/bootstrap.css",
              "~/Content/bootstrap-chosen.css",
              "~/Content/site.css"));

_Layout.cshtml

(Top) @Styles.Render("~/Content/css")
      @Scripts.Render("~/bundles/modernizr")

(Bottom) @Scripts.Render("~/bundles/jquery")
         @Scripts.Render("~/bundles/bootstrap")
         @RenderSection("scripts", required: false)

在我的剃须刀页面中,我有以下内容

@Html.DropDownListFor(model => model.HASSForm.HASS_District_Id, new SelectList(Model.HASSDistricts, "Id", "ENGL_NAME"), new { htmlAttributes = new { @class = "form-control chosen-select" } })

在页面底部我有以下内容

@section Scripts {
@Scripts.Render("~/bundles/jqueryval")
<script type="text/javascript">
    $(function () {
        $(".chosen-select").chosen();
    });
</script>
}

我希望下拉菜单显示一个搜索框,但我只得到常规的下拉列表。

如果有人能帮助我,将不胜感激。

我建议从头开始这个项目,有一个有用的video

然后我将示例解决方案推送到 bitbucket