清除并刷新 jQuery 选择的下拉列表
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/20148195/
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
Clear and refresh jQuery Chosen dropdown list
提问by plexcell
I'm trying to clear jQuery Chosen dropdown list and refresh it.
我正在尝试清除 jQuery 选择的下拉列表并刷新它。
HTML:
HTML：
<select data-placeholder="Select Picture..." class="chosen-select" style="width:250px;" id="picturegallery" tabindex="2">
<option value="" selected="selected"></option>
<option value="x">remove me</option>
</select>
When I click "Refresh" button, it should turn into this:
当我点击“刷新”按钮时，它应该变成这样：
<select data-placeholder="Select Picture..." class="chosen-select" style="width:250px;" id="picturegallery" tabindex="2">
<option value="1">test</option>
</select>
What I have tried:
我尝试过的：
$("#refreshgallery").click(function(){
$('#picturegallery').empty();
var newOption = $('<option value="1">test</option>');
$('#picturegallery').append(newOption);
});
But I can't get it to update that dropdown list... Some help? :)
但我无法让它更新下拉列表...一些帮助？:)
回答by Praveen
Using .trigger("chosen:updated");you can update the options list after appending.
使用.trigger("chosen:updated");您可以在附加后更新选项列表。
Updating Chosen Dynamically:If you need to update the options in your select field and want Chosen to pick up the changes, you'll need to trigger the "chosen:updated" event on the field. Chosen will re-build itself based on the updated content.
动态更新选择：如果您需要更新选择字段中的选项并希望选择获取更改，则需要在该字段上触发“选择：更新”事件。Chosen 将根据更新的内容重新构建自己。
Your code:
您的代码：
$("#refreshgallery").click(function(){
$('#picturegallery').empty(); //remove all child nodes
var newOption = $('<option value="1">test</option>');
$('#picturegallery').append(newOption);
$('#picturegallery').trigger("chosen:updated");
});
回答by ca michel
If trigger("chosen:updated");not working, use .trigger("liszt:updated");of @Nhan Tran it is working fine.
如果trigger("chosen:updated");不工作，使用.trigger("liszt:updated");@Nhan Tran 它工作正常。
回答by dxpkumar
$("#idofBtn").click(function(){
$('#idofdropdown').empty(); //remove all child nodes
var newOption = $('<option value="1">test</option>');
$('#idofdropdown').append(newOption);
$('#idofdropdown').trigger("chosen:updated");
});
回答by user3043330
MVC 4:
MVC 4：
function Cargar_BS(bs) {
$.getJSON('@Url.Action("GetBienServicio", "MonitoreoAdministracion")',
{
id: bs
},
function (d) {
$("#txtIdItem").empty().append('<option value="">-Seleccione-</option>');
$.each(d, function (idx, item) {
jQuery("<option/>").text(item.C_DescBs).attr("value", item.C_CodBs).appendTo("#txtIdItem");
})
$('#txtIdItem').trigger("chosen:updated");
});
}
回答by Mubashar Shahzad
In my case, I need to update selected value at each change because when I submit form, it always gets wrong values and I used multiple chosen drop downs. Rather than updating single entries, change selector to update all drop downs. This might help someone
就我而言，我需要在每次更改时更新选定的值，因为当我提交表单时，它总是得到错误的值，并且我使用了多个选择的下拉列表。不是更新单个条目，而是更改选择器以更新所有下拉列表。这可能会帮助某人
$(".chosen-select").chosen().change(function () {
var item = $(this).val();
$('.chosen-select').trigger('chosen:updated');
});
