使用 AJAX 附加 select 选择器

Question

我正在尝试用 AJAX 填充 Bootstrap select。当我为一个简单的 select 做它时，它起作用了，但是当我为 bootstrap selectpicker 尝试它时，它不起作用。我进行了搜索，发现我应该刷新 selectpicker，但我不知道该怎么做。

$.ajax({
    url: "readDistricts?four=" + four + "&sfam=" + sfam,
    data: JSON.stringify(four),
    data: JSON.stringify(sfam),
    dataType: 'json',
    contentType: 'application/json',
    type: 'POST',
    async: true,
    success: function(res) {
        // alert(res.articles.length);
        console.log(res.articles.length);
        for (var i = 0; i < res.articles.length; i++) {
            // alert(res.articles[i].CNUF_FOURNISSEUR);
            // alert(res.articles[i].LIBELLE_ARTICLE);
            console.log(" " + res.articles[i].CNUF_FOURNISSEUR);
            console.log(" " + res.articles[i].LIBELLE_ARTICLE);

            $('#articles').append(
                '<option value=' + res.articles[i].CNUF_FOURNISSEUR + '>' + res.articles[i].LIBELLE_ARTICLE + '</option>'
            );
        }
    }
});

这是我的 select，这是一个 struts 标签：

 <s:select  class="form-control selectpicker"    
    list="sfams" headerKey="0" headerValue="Veuillez selectionner" 
    listValue="LIBELLE_SFAM" listKey="ID_SFAM"  id="sfam"  />

Answer 1

完成AJAX后，需要重新加载插件：

$('#articles').selectpicker('refresh');

或

success: function(data)
{
  $("#articles").html(data).selectpicker('refresh');
}

阅读更多信息：https://developer.snapappointments.com/bootstrap-select/methods/#selectpickerrefresh

使用 AJAX 附加 select 选择器

Append a select picker with AJAX

ajax

twitter-bootstrap

struts2