使用 AJAX 加载 Bootstrap 选择器

Question

我有一个与this和this类似的问题。我已经尝试了评论中描述的所有解决方案。并达到了它可以工作的程度。

我的问题，当我从#main_cat内容中选择一个选项时.sub_cat是第一次加载（AJAX 加载正确）。但是如果我从#main_cat加载的内容中选择另一个选项但不使用选择选择器样式。它只是显示：

glyphicon-sort-by-alphabetOPTION 1 （以下截图）

HTML

<select id="main_cat" name="main_cat" class="selectpicker">
    <option selected="-1">Kies een thema</option>
    <option value="Actief_Avontuur" data-name="Actie & avontuur" data-icon="glyphicon-sort-by-alphabet" class="special">&nbsp;&nbsp;Actief, sportief en avontuurlijk</option>
    <option value="Creatief" data-name="Creatief" data-icon="glyphicon-sort-by-alphabet-alt" class="special">&nbsp;&nbsp;Creatief</option>
</select>
<select name="sub_cat" disabled="disabled" class="selectpicker_1 sub_cat">

jQuery

$(function(){
    $('#main_cat').change(function(){
        var $option = $(this).find('option:selected'),
            id = $option.val(),
            name = $option.data('name');
            // open your browser's console log and ensure that you get the correct values
        console.log(id, name);
            $(".sub_cat").empty();
            // call ajax
        $.ajax({
            url: "<?php bloginfo('wpurl'); ?>/wp-admin/admin-ajax.php",     
            type:'POST',
            data: {
                action: 'my_special_ajax_call',
                main_catid: id,
                main_name: name
            },
            success: function (results) {
                $(".sub_cat").removeAttr('disabled').html(results);
                $('.selectpicker_1').selectpicker(["refresh"]);
            }
        });
    });
});         

我尝试selectpickers使用以下方法刷新两者：

$('.selectpicker').selectpicker(["refresh"]);
$('.selectpicker_1').selectpicker(["refresh"]);

这（正如链接中的问题所建议的那样）

$('.selectpicker').selectpicker({});

以下是一些屏幕截图：第一个是我第一次选择该选项时，第二个是我从#main_cat. 我是否必须对 a 做一些事情，foreach以便在 AJAX 完成时不断重新加载？有人知道解决方案吗？

第一次选择一个选项

第二次选择一个选项

Answer 1

我是这样用的：

$.ajax({
    url: "yoururl",
    type: 'post',
    data: {data: data},
     success: function(response){
            target.empty();
            target.html(response);
            target.selectpicker('refresh'); // without the []
    }
});

请注意，我清空了选择，使响应变笨并在之后刷新......它工作正常！:D 希望这有助于...