Question

我有一个get请求，它会获取一堆类别信息来填充<select>。我正在使用jQuery UI Selectmenu来设置我的选择样式。

所以我的jQuery看起来有点像这样：

//Initalise the selectmenu
$("select").selectmenu({ style: 'dropdown' });

$.get("http://localhost/somedata?cat=2", function (data) {
    $.each(data, function (index, itemData) {
        $("<option value='" + itemData.Id + "'>" + itemData.Name + "</option>").appendTo("#selectList");
    });
});

但是这会填充<select>，但不会更新jQuery UI selectmenu。我需要做些什么才能让selectmenu'重新绘制'以便新值出现在selectmenu中？

Answer 1

您可以使用development wiki中记录的恰当命名的refresh方法：

$("select").selectmenu({ style: 'dropdown' });

$.get("http://localhost/somedata?cat=2", function(data) {
    $.each(data, function(index, itemData) {
        $("<option value='" + itemData.Id + "'>" + itemData.Name
            + "</option>").appendTo("#selectList");
    });

    $("select").selectmenu("refresh");
});

更新：不幸的是，refresh函数已记录在案，但似乎尚未实现。另一种选择是销毁小部件并重新创建它：

$("select").selectmenu("destroy").selectmenu({ style: "dropdown" });

Answer 2

我推荐ajax方式......这个

$(document).ready(function(){
  $.ajax({
                   url :/somedata?cat=2,          

                   success:function(data){
                        $.each(data, function (index, itemData) {
        $("<option value='" + itemData.Id + "'>" + itemData.Name + "</option>").appendTo("#selectList");
    });

                   }
                });
$("select").selectmenu({ style: 'dropdown' });
});

Answer 3

这是一个非常老的问题，所以目前有a much simpler solution个可用的

$("select").selectmenu("refresh");

更新后'刷新'jquery UI selectmenu

3 个答案: