.selectpicker（'refresh'）不会刷新阿尔戈利亚上的引导程序选择会自动完成

Question

我正在使用Algolia场所进行城市查找，然后为所选结果填充州和邮政编码。我面临的问题是状态更改时，引导选择器的值已更新，但文本未更新。

我尝试使用.selectpicker（'refresh'），但无法使其正常工作。

<script>
(function() {
    var placesAutocomplete = places({
    appId: 'myID',
    apiKey: 'myKey',
    container: document.querySelector('#city-input'),
    templates: {
        value: function(suggestion) {
        return suggestion.name;
        }
    }
    }).configure({
    countries: ['us', 'ca'],
    type: 'city'
    });
    placesAutocomplete.on('change', function resultSelected(e) {
    document.querySelector('#state-select').value = e.suggestion.administrative || '';
    document.querySelector('#zipcode-input').value = e.suggestion.postcode || '';
    });
    $('#state-select').selectpicker('refresh');
})();

从结果列表中的城市列表中选择城市后，状态值将更改，但仍会显示初始文本，但是如果单击状态选择框，则会看到已选择新的状态。 / p>

有什么想法吗？

Answer 1

在SnapAppointments中研究了文档，发现不需要刷新，而只是刷新选择器中的项目列表。

实际上，您必须以不同的方式更新选择器：“ 这与直接在select元素上调用val（）不同。如果直接在元素上调用val（），则引导选择ui不会刷新（因为更改事件仅从用户交互中触发）。您将必须自己调用ui刷新方法。“

所以代替：

$('#state-select').value = e.suggestion.administrative || '';
$('#state-select').selectpicker('refresh');

您需要执行以下操作：

$('#state-select').selectpicker('val', e.suggestion.administrative);

这将更新选择器，就像最终用户单击它一样。