引导选择DropDownList不显示 [英] Bootstrap-select DropDownList not showing

问题描述

我有一个引导选择组合框，我在ajax调用中填充了数据 HTML

I have a bootstrap-select combobox that I fill with data in an ajax call Html:

<div class="row">
<select id="selectGemeente1" class="selectpicker" data-live-search="true"></select>
</div>

Ajax呼叫:

var gemeenteLijst = [];

var GetGemeentes = function () {
    $.ajax({
        type: "GET",
        dataType: "json",
        url: 'https://localhost::blabla',
        contentType: "application/json; charset=utf-8",
        success: function (data) {
            var test = document.getElementById("selectGemeente1");
            data.forEach(function (item) {
                var opt = document.createElement("option");
                opt.value = item.GemeenteId;
                opt.innerHTML = item.Naam;
                test.appendChild(opt);
            });         
        },
        error: function (xhr, status, error) {
            alert(xhr.responseText);
        }
    });
}

$(document).ready(function () {
    GetGemeentes();  
})

运行应用程序后，我的选择已填充，但下拉列表未打开..

After running my application, my select is filled but the dropdown is not opening..

运行后html

我已经看到很多解决方案，说我应该把它放在我的$(document).ready

I have seen a lot of solutions saying that I should put this in my $(document).ready

$(".selectpicker").html(optgroup);

但是然后我收到一条错误消息，说.selectpicker不是函数.

but then I get an error saying that .selectpicker is not a function.

gemeenteLijstLaden.js:36 Uncaught TypeError: $(...).selectpicker is not a function

我已经实现了这些脚本文件

I have implemented these script files

<script src="~/Scripts/jquery-2.2.3.min.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.10.0/js/bootstrap-select.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.10.0/js/i18n/defaults-nl_NL.min.js"></script>
<script src="~/Scripts/myCharts/gemeenteLijstLaden.js"></script>

推荐答案

我找到了解决方案. 我只需要刷新我的选择

I found a solution. I just needed to refresh my select

$('.selectpicker').selectpicker('refresh');

这篇关于引导选择DropDownList不显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！