Sometimes, we want to disable an option in a select based on its value with JavaScript.
In this article, we’ll look at how to disable an option in a select based on its value with JavaScript.
How to disable an option in a select based on its value with JavaScript?
To disable an option in a select based on its value with JavaScript, we can set its disabled property to true.
For instance, we write
document.querySelectorAll("#foo option").forEach((opt) => {
if (opt.value === "example") {
opt.disabled = true;
}
});
to select the option elements in the drop down with querySelector.
Then we call forEach with a callback that checks if the value attribute’s value is 'example'.
If it is, then we set its disabled property to true to disable it.
Conclusion
To disable an option in a select based on its value with JavaScript, we can set its disabled property to true.
