Sometimes, we want to programmatically set the value of a select box element using JavaScript.
In this article, we’ll look at how to programmatically set the value of a select box element using JavaScript.
How to programmatically set the value of a select box element using JavaScript?
To programmatically set the value of a select box element using JavaScript, we can set the value property of the select element.
For instance, we write
<select id="leaveCode" name="leaveCode">
<option value="10">Annual Leave</option>
<option value="11">Medical Leave</option>
<option value="14">Long Service</option>
<option value="17">Leave Without Pay</option>
</select>
to add a select element.
Then we write
const leaveCode = document.querySelector("#leaveCode");
leaveCode.value = "14";
to call querySelector to select the select element.
Then we set its value property to '14' to select the option with value attribute set to 14.
Conclusion
To programmatically set the value of a select box element using JavaScript, we can set the value property of the select element.
