JQueryUI selectmenu - 如何添加更多选项

时间:2012-09-05 00:51:49

标签: javascript jquery-ui jquery-ui-selectmenu

通过javascript如何向下拉菜单中添加更多选项?

目前正在尝试以下但没有运气:

for (i = 0; i < json.powerDropDownItems.length; i++) {
    //$('#powerSelect').append($("<option></option>").attr("value", json.powerDropDownItems[i]).text(json.powerDropDownItems[i]));
    $('#powerSelect').selectmenu("value", "nice name");
    //$('#powerSelect').appendTo("<option>" + json.powerDropDownItems[i] + "</option>");
}
$('#powerSelect').selectmenu("refresh");​

更新

感谢naveen,我让它工作了(还添加了清除列表的代码)。这是我的以下代码:

 service.getPowerDropDowns(productEC, $('#mountSelect').val(), function (response) {
       var json = $.parseJSON(response.value);

       var options = [];

       // Clear the options first   
       $("#powerSelect option").each(function(index, option) {
            $(option).remove();
       });
        options.push("<option value=''>Choose</option>");
        for (i = 0; i < json.powerDropDownItems.length; i ++)
        {
            options.push("<option value='" + json.powerDropDownItems[i] + "'>" + json.powerDropDownItems[i] + "</option>");
        }
        $('#powerSelect').append(options.join("")).selectmenu();
        $('#powerSelect').selectmenu('enable');
    });

2 个答案:

答案 0 :(得分:6)

这将有效

$(function() {
    var options = []; 
    for (i = 0; i < json.powerDropDownItems.length; i++) {
        options.push("<option value='" + json.powerDropDownItems[i] + "'>" + json.powerDropDownItems[i] + "</option>");
    }
    //append after populating all options
    $('#powerSelect')
        .append(options.join(""))
        .selectmenu();
});​

演示:http://jsfiddle.net/codovations/p863Q/

答案 1 :(得分:4)

取决于版本。

https://github.com/jquery/jquery-ui/tree/selectmenu使用刷新方法

https://github.com/fnagel/jquery-ui/tree/selectmenu使用像naveen描述的selectmenu()。