How to add option values on silviomoreto's Bootstrap-Select

I used silviomoreto's bootstrap-select but I'm having problems.
I have 2 Dropdowns (Select) a Region dropdown and Cities. Now, I have a jquery onchange function, the function will change the values in the cities dropdown depending on the region selected. Here's my code:

<select id="region" class="selectpicker"></select>
<select id="cities" class="selectpicker"></select>

$("#region").on('change', function ()
$("#cities").html('<option>city1</option><option>city2</option>');
);


The problem is I think the compatibility? When I removed the class="selectpicker" it works fine, but I can't remove it because I used it for my dropdown ui. I checked the documentation in here https://developer.snapappointments.com/bootstrap-select/ but I can't find relevant answer to my question. Thanks!

1 Answer
1

Try selectpicker('refresh').

selectpicker('refresh')

To programmatically update a select with JavaScript, first manipulate
the select, then use the refresh method to update the UI to match the
new state. This is necessary when removing or adding options, or when
disabling/enabling a select via JavaScript.

Snippet

$("#cities")
.html('<option>city1</option><option>city2</option>')
.selectpicker('refresh');


Working Demo: http://jsfiddle.net/codeandcloud/nr54vx7b/

Required, but never shown

Required, but never shown

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.