Html/jQuery - 使用 multi-select jquery ui 下拉菜单但无法正常工作

Html/jQuery - Used multi-select jquery ui dropdown but not working proprely

问题: 将选项附加到不同的下拉列表而不是 multiselect 下拉列表

我已经给出了所有代码并使用了 multiselect() 函数,但实际上选项附加到不同的新 select 标签而不是 multiselect 下拉列表。

请参考图像以了解实际工作情况,这是不正确的。

这里是Fiddle

HTML

<select id="impact-report-type-filter-input" name="impact-report-type-filter-input" multiple='multiple'>
</select>

Jquery

$(document).ready(function() {
    $("#impact-report-type-filter-input").multiselect({
        noneSelectedText: 'Select Legends',
        minWidth: 165,
        header: "Select Legend(s)",
    });
    getDropDownOptions()
})



 function getDropDownOptions(filterType) {

    $.ajax({
        'async': false,
        'type':'POST',
        'url':"/" + $("#app").val() + "/reports/getDataforChart"
        'success':function(data) {
            console.log(data)
            var xml = data.xml;
            var filterList = data.filterList;
            alert(Object.prototype.toString.call(filterList));

            for(f in filterList){
                $('#impact-report-type-filter-input').append($('<option>', {
                     value: filterList[f],
                     text:  filterList[f]
                }));
            }
            $("#impact-report-type-filter-input").multiselect("rebuild"); 

            /*var html = '';

            for (var i = 0, len = filterList.length; i < len; ++i) {
                html.join('<option value="' + filterList[i]['value'] + '">' + filterList[i]['label'] + '</option>');
            }           

            $('#impact-report-type-filter-input').append(html);*/

            typeFilterChartID.setXMLData(xml) ;
            var dataPieData = document.getElementById("impact-report-type-filter") ;
            typeFilterChart.render(dataPieData);
          }
    });
}

答:忘了刷新 $("#impact-report-type-filter-input").multiselect("refresh");

只需将上面jQuery getDropDownOptions(filterType)函数中的$("#impact-report-type-filter-input").multiselect("rebuild");替换为$("#impact-report-type-filter-input").multiselect("refresh");即可。