How to get an array like ["Apple", "Orange"] of currently selected items of a multiple-selection HTML select?
We could probably parse the <option> HTML of s.selectedOptions but there is surely a more standard way:
var s = document.getElementById('mySelect');
document.onclick = () => {
console.log(s.selectedIndex);
console.log(s.selectedOptions);
};
<select multiple id="mySelect">
<option>Apple</option>
<option>Orange</option>
<option>Pineapple</option>
<option>Banana</option>
</select>
>Solution :
Currently there is no better way but to map over the selectedOptions.
document.getElementById('mySelect').addEventListener('change', function(e){
console.clear();
const selectedVals = [...this.selectedOptions].map(o => o.value);
console.log(selectedVals);
});
<select multiple id="mySelect">
<option>Apple</option>
<option>Orange</option>
<option>Pineapple</option>
<option>Banana</option>
</select>