How onInitialized works in Bootstrap-multiselect

Question

Very simple example : https://jsfiddle.net/x6z6w0n8/8/

How can I set selected values on Initialization step without creating duplicate?

Sample from off site works well. https://jsbin.com/yupinelefa/edit?html,js,console

---

As I noticed, in off-example they don't initialize select, they just use event onInitialized. But when I initialize (set options) to select in onInitialized event then nothing is changed, I also have 2 selects.

---

In general - I have bootstrap-multiselect on page. OnInitialization I want to set selected values in it. I have next code as example :

<select id="example-onInitialized" multiple="multiple" class="multiple">
     <option value="1">Option 1</option>
     <option value="2">Option 2</option>
     <option value="3">Option 3</option>
     <option value="4">Option 4</option>
     <option value="5">Option 5</option>
     <option value="6">Option 6</option>
</select>

$('.multiselect').multiselect({
            onInitialized: function(select, container) {
               $(select).multiselect('select', 2); // I want to select item with value '2'
         }
});

But this script creates one additional select. So as result I have one select with selected value '2' and one empty select. For me it seems like every call of .multiselect() will create new select. Is it right? Thanks.

Answer 1

Updated fiddle.

That happen because select is an option that should be called always on .multiselect() (that initialize the plugin), so in your case your plugin will be initilized for the second time when you will use it.

onInitialized() is a function which is triggered when the multiselect is finished initializing.

The select option is made to select also the given values after initialization of the plugin, so you could just use it like :

$('.multiple').multiselect('select', 2);

Hope this helps.