Method to programmatically select option

[fardhana]

Hi, This is a simple and nice plugins. I really like the UI. Good Job.

Is it possible to select option programatically? I've tried to set value on select element using val() then trigger change() event but item is not moved to selected wrapper.

Thanks!

[fardhana]

Solved, i don't know what's different. But it's work when using vanilla javascript approach using dispatchEvent() method

Thanks

[2x2p]

can you tell me how you have sent the dispatchEvent() to the element for it to work? I have it working but cannot call any inner multi functions thereafter: var team1 = multi(ele, { non_selected_header:"Candidates", selected_header:"Team A" });

[fardhana]

var doohSelect = document.getElementById('doohLocations');
multi( doohSelect , {selected_header: 'DOOH Terpilih', non_selected_header: 'Pilihan DOOH', search_placeholder: 'Cari DOOH...'});
/* set your value to original select tag, then.. */
doohSelect.dispatchEvent(new Event('change'));

hope this information help you

[2x2p]

yes it helped a lot :-)

var team_1_select = document.getElementById('team_1_select');

multi(team_1_select, {
  non_selected_header: "Candidates",
  selected_header: "Team A"
});

var timer = function(){ team_1_select.dispatchEvent(new Event('change')); };
setInterval(timer, 1000);`

now the multi object is auto refreshing once per second. An acceptable solution for the moment for my application. Not sure how this does on huge lists. It needs testing on how low the interval can be.

One more drawback I found of this usage, is that the timed 'change' event will stop the mouse scroll or a finger scroll movement on a tablet or phone :-/