The event type change will be triggered when a different item is selected from the combo box, but won't be triggered when the same item is selected again. What other event type or trick/loophole will get me the desired action?
const options = document.querySelector('#select');
options.addEventListener('change', function() { // won't be triggered when chosen the item chosen is the same
console.log(this.value);
});
<select id="select">
<option value="1" selected>1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
Default and expected behaviour of a select, is the change event triggering when you CHANGE the select. If you just look at the options and choose the same option that was already selected, then no event is expected. So if you need to trigger each time, then you need to use the use click
In any case add a "Please select" to allow the event to trigger on the first actual options
document.querySelector('#select').addEventListener('click', function() {
if (this.value) console.log(this.value);
});
<select id="select">
<option value="" selected>Please select</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>