CODEWITHSUNDEEP
javascriptjqueryhtmltwitter-bootstrap
Null Reference
Null Reference

Reputation: 11360

Bootstrap: select/option list doesn't get refreshed after programmatically adding item

I have the following select/option

<select class="bs-select form-control">
    <option value="AL">Alabama</option>
    <option value="WY">Wyoming</option>
</select>

In my script section, I have this, which works fine. The styles are being applied

$(document).ready(function () {
    $('.bs-select').selectpicker();
});

I have a button that does this:

$('.bs-select').append($('<option>', {
                        value: 0,
                        text: "test"
                    }));

However my select list isn't refreshed.

I tried adding 

$('.bs-select').selectpicker();

after the append but it still doesn't work.

My select list gets refreshed if I remove the $('.bs-select').selectpicker() in $(document).ready

How can I get my list to refresh after adding an item?

Upvotes: 17

Views: 23477

Answers (1)

Selvaraj M A
Selvaraj M A

Reputation: 3136

Use refresh after adding new option 

$('.bs-select').selectpicker('refresh');

Upvotes: 32

Related Questions