Javascript selectize.js 重新加载下拉菜单
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/30457966/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
selectize.js reload dropdown
提问by Obaid Ahmed
I have a dropdown with id "selectCountry" filled by ajax and on success I just bind the Selectize.
我有一个由ajax填充的ID为“selectCountry”的下拉列表，成功后我只绑定了Selectize。
$('#selectCountry').selectize({
create: true,
sortField: 'text'
});
When I rebind my original dropdown by ajax and try to reload/rebind or refreshed the old selectize auto complete box on success, there would be no change on old list.
当我通过 ajax 重新绑定我的原始下拉列表并尝试重新加载/重新绑定或成功刷新旧的选择自动完成框时，旧列表上不会有任何变化。
Is there any way to reload or refresh selectize dropdown? I had try "clearOptions()" and "refreshOptions()".
有没有办法重新加载或刷新选择下拉列表？我曾尝试过“clearOptions()”和“refreshOptions()”。
P.S, I don't want to directly bind the selectize from ajax.
PS，我不想直接从ajax绑定selectize。
OK, now I am adding working example for this issue on jsfiddle
好的，现在我正在jsfiddle上为这个问题添加工作示例
Please help me :( any suggestion would be great for me. Thanks alot
请帮助我:(任何建议对我来说都会很棒。非常感谢
回答by Obaid Ahmed
回答by PhiLho
Looks like you also opened an issue on the project, which isn't, IMHO, a good usage of the issues of the project.
看起来您还在项目上打开了一个问题，恕我直言，这不是项目问题的一个很好的用法。
I answered there, I will repeat the answer here in case it can be useful to other people.
我在那里回答过，我会在这里重复回答，以防对其他人有用。
You should not re-create the Selectize component out of the original tag. You should use it to update its options, using clearOptions() as you guessed, then addOption() (despite the singular, it accepts an array). I updated your fiddle (+1 for making one) to show this: https://jsfiddle.net/m06c56y0/20/
您不应使用原始标记重新创建 Selectize 组件。您应该使用它来更新它的选项，按照您的猜测使用 clearOptions()，然后使用 addOption()（尽管是单数，但它接受一个数组）。我更新了你的小提琴（制作一个+1）以显示这一点：https: //jsfiddle.net/m06c56y0/20/
The relevant part is:
相关部分是：
var selector;
$('#button-1').on('click', function () {
selector = $('#select-tools').selectize({
maxItems: null,
valueField: 'id',
labelField: 'title',
searchField: 'title',
options: [{
id: 1,
title: 'Spectrometer',
url: 'http://en.wikipedia.org/wiki/Spectrometers'
}, {
id: 2,
title: 'Star Chart',
url: 'http://en.wikipedia.org/wiki/Star_chart'
}],
create: false
}).data('selectize');
});
$('#button-2').on('click', function () {
console.log(selector);
selector.clearOptions();
selector.addOption([{
id: 1,
title: 'Spectrometer',
url: 'http://en.wikipedia.org/wiki/Spectrometers'
}, {
id: 3,
title: 'Electrical Tape',
url: 'http://en.wikipedia.org/wiki/Electrical_tape'
}]);
});
回答by StealthRT
You can also do this:
你也可以这样做：
$('#whateverYouCalledIt').selectize()[0].selectize.clear();
for just clearing what has been selected. It will not clear your select list.
只是清除已选择的内容。它不会清除您的选择列表。
