清除并刷新jQueryselect下拉列表
我试图清除jQueryselect下拉列表并刷新它。
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>
当我点击“刷新”button,它应该变成这样:
<select data-placeholder="Select Picture..." class="chosen-select" style="width:250px;" id="picturegallery" tabindex="2"> <option value="1">test</option> </select>
我曾经尝试过:
$("#refreshgallery").click(function(){ $('#picturegallery').empty(); var newOption = $('<option value="1">test</option>'); $('#picturegallery').append(newOption); });
但我不能得到它来更新下拉列表…一些帮助? 🙂
使用.trigger("chosen:updated");
您可以在追加后更新选项列表。
更新dynamicselect: 如果您需要更新select字段中的选项,并希望select选取更改,则需要在该字段上触发“select:更新”事件。 select将根据更新的内容重新构build自己。
你的代码:
$("#refreshgallery").click(function(){ $('#picturegallery').empty(); //remove all child nodes var newOption = $('<option value="1">test</option>'); $('#picturegallery').append(newOption); $('#picturegallery').trigger("chosen:updated"); });
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"); }); }
$("#idofBtn").click(function(){ $('#idofdropdown').empty(); //remove all child nodes var newOption = $('<option value="1">test</option>'); $('#idofdropdown').append(newOption); $('#idofdropdown').trigger("chosen:updated"); });