Javascript Reference - HTML DOM Option disabled Property

The disabled property disables or enables an option in a drop-down list.

Browser Support


`disabled`	Yes	Yes	Yes	Yes	Yes

Syntax

Return the disabled property.

var v = optionObject.disabled

Set the disabled property.

optionObject.disabled=true|false

Property Values

Value	Description
true\|false	Disable or enable an option in a drop-down list. true - The option is disabled false - Default. The option is not disabled

Return Value

A Boolean value type, true if the option is disabled, otherwise false.

Example

The following code shows how to check if the second option (index 1) in a drop-down list is disabled.


<!DOCTYPE html>
<html>
<body>
<!--   w  w w  .j a  va  2s .  c om-->
<select id="pets" size="3">
  <option>A</option>
  <option disabled>B</option>
  <option>C</option>  
</select>
<button onclick="myFunction()">test</button>

<p id="demo"></p>

<script>
function myFunction() {
    var x = document.getElementById("pets");
    document.getElementById("demo").innerHTML = x.options[1].disabled;
}
</script>

</body>
</html>

The code above is rendered as follows:

Example 2

The following code shows how to disable the third option (index 2) in a drop-down list.


<!DOCTYPE html>
<html>
<body>
<!--   w w  w.  j a v a  2s .co  m-->
<select id="pets" size="3">
  <option>A</option>
  <option>B</option>
  <option>C</option> 
</select>
<button onclick="myFunction()">test</button>

<script>
function myFunction() {
    var x = document.getElementById("pets");
    x.options[2].disabled = true;
}
</script>

</body>
</html>

The code above is rendered as follows: