ajax-bootstrap-select 是否支持 liveSearch？答案

【问题标题】：Does ajax-bootstrap-select support liveSearch?ajax-bootstrap-select 是否支持 liveSearch？
【发布时间】：2019-10-16 23:03:11
【问题描述】：

我有一个基本的下拉菜单，它使用 bootstrap-selectpicker 库使用包含格式搜索下拉选项，我使用 ajax-bootstrap-select 插件 https://github.com/truckingsim/Ajax-Bootstrap-Select 填充下拉选项并且我正在尝试找到一种方法来使用“包含”操作来搜索 ajax 填充的下拉选项，就像在原始 selectpicker 中一样。

我以前只使用 selectpicker，最近才使用 ajax 插件，我不确定插件的功能是否只是从“url”中获取选项。或者如果它从填充的选项中进行搜索并且我在编码时错过了任何参数。

<select class="selectpicker" multiple data-selected-text-format="count" data-actions-box="true" data-live-search="true" data-show-tick="false" data-live-search-style="contains">
</select>

<script>
var options = {

    ajax: {

    url: '/Search/Typeahead',

    type: 'POST',

    dataType: 'json',

    data: function () {
        var params = {
            q: '{{{q}}}'
        };

        return params;
    }
},

locale: {
        emptyTitle: 'Select and Begin Typing'
},

preprocessData: function (data) {
    var i, l = data.length, array = [];
    if (l) {
        for (i = 0; i < l; i++) {
            var curr = data[i];

            array.push({
                'value': curr.value,
                'text': curr.text,
                'disabled': curr.disabled,
                'selected': curr.selected,
            });
        }
    }
    return array;
},

preserveSelected: false
};
$('select.selectpicker').selectpicker({liveSearch: true }).ajaxSelectPicker(options);

$('.bootstrap-select').selectpicker();

//The dropdown options are not displayed at all if I use **.filter('.with-ajax')** as below:
//$('select.selectpicker').selectpicker({liveSearch: true }).filter('.with-ajax').ajaxSelectPicker(options);

//Also tried using <select class="selectpicker **with-ajax** " but it doesn't work for me either

$('select.selectpicker').trigger('change');
</script>

我有 ajax 填充选项，但搜索关键字不会改变下拉选项。

【问题讨论】：

这只是 bootstrap-select (github.com/snapappointments/bootstrap-select) 的扩展，它需要首先初始化 bootstrap-select 才能工作。你是先初始化 bootstrap-select 吗？
感谢您的快速回复，史蒂夫。是的，我已经在 ajax-selectpicker 插件之前初始化了 bootstrap-select。
例如如果我从 Javascript 中删除 .ajaxSelectPicker(options) 并添加 asp-for="DDOptions" asp-items="Model.DDOptions" 然后它使用引导选择按预期工作-即使用“包含”进行搜索

标签： javascript bootstrap-selectpicker

【解决方案1】：

试试

$('.bootstrap-select').selectpicker('refresh');

而不是

$('.bootstrap-select').selectpicker();

有时您可以使用检查器看到 HTML 中的更改，更改后需要刷新 selectpicker。

【讨论】：