bootstrap multiselect not working on api json bind in Ajax call in jquery

问题

I am trying to use Bootstrap multiselect checkbox in my page. if the data to it is static, it is working fine without problem. but if i dynamically bind json data to it, the drop down is not working.

This is my HTML :

<select id="categories" ></select>

And this is loading when DOM is ready :

var categCheck  = $('#categories').multiselect({
    includeSelectAllOption: true,
     enableFiltering : true
});

Here is the API call through ajax, where i am getting data from it.

$.ajax({
    type: 'GET',
    url: '/api/categoryapi',
    success: function(data) {
        $.each(data, function (index, item) {
            var opt = $('<option />', {
                value: item._id,
                text: item.title
            });
            opt.appendTo(categCheck);
            categCheck.multiselect('refresh');
        });
    }
});

When I try to pull down the drop down box, it is not working, I couldn't find out the problem. Am I doing any mistake here ? Even I have added all supporting files which is required for multi select box in the html page.

Can anyone help me out?

回答1:

Instead of using,

categCheck.multiselect('refresh');

i have tried 'rebuild',

categCheck.multiselect('rebuild');

This works fine!

来源：https://stackoverflow.com/questions/34987559/bootstrap-multiselect-not-working-on-api-json-bind-in-ajax-call-in-jquery