HTML | DOM Fieldset disabled Property

The Fieldset disabled Property in HTML DOM is used to set or return whether a fieldset is disabled or not. A Disabled element is unusable and un-clickable and is usually rendered grey in color by Default. This Property is used to reflect the HTML disabled attribute.

Syntax:

It returns the disabled property:
```
fieldsetObject.disabled
```
It is used to set the disabled property:
```
fieldsetObject.disabled = true|false 
```

Property Values:

true: The fieldset is disabled.
false: It has a default value. The fieldset is not disabled.

Return Value: It returns a Boolean value which represents whether the fieldset is disabled or not.

Example-1: This Example returns the disabled Property.

<!DOCTYPE html> 
<html> 
  
<head> 
    <title> 
      DOM fieldset disabled Property 
  </title> 
    <style> 
        h1, 
        h2, 
        .titl { 
            text-align: center; 
        } 
          
        fieldset { 
            width: 50%; 
            margin-left: 22%; 
        } 
          
        h1 { 
            color: green; 
        } 
          
        button { 
            margin-left: 35%; 
        } 
    </style> 
</head> 
  
<body> 
    <h1> 
      GeeksforGeeks 
  </h1> 
    <h2> 
      DOM fieldset disabled Property 
  </h2> 
  
    <form> 
        <div class="titl"> 
            Suggest article for video: 
      </div> 
  
        <fieldset id="GFG" disabled> 
            <legend>JAVA:</legend> 
            Title: 
            <input type="text"> 
            <br> Link: 
            <input type="text"> 
            <br> User ID: 
            <input type="text"> 
        </fieldset> 
  
    </form> 
    <br> 
  
    <button onclick="Geeks()"> 
      Submit 
  </button> 
    <p id="sudo" 
       style="font-size:25px; 
              text-align:center;"> 
  </p> 
    <script> 
        function Geeks() { 
            var g =  
                document.getElementById( 
                  "GFG").disabled; 
            
            document.getElementById( 
              "sudo").innerHTML = g; 
        } 
    </script> 
</body> 
  
</html> 

Output:

Before Clicking On Button:

After Clicking On Button:

Example-2: This Example sets the disabled Property.

<!DOCTYPE html> 
<html> 
  
<head> 
    <title> 
      DOM fieldset disabled Property 
  </title> 
    <style> 
        h1, 
        h2, 
        .titl { 
            text-align: center; 
        } 
          
        fieldset { 
            width: 50%; 
            margin-left: 22%; 
        } 
          
        h1 { 
            color: green; 
        } 
          
        button { 
            margin-left: 35%; 
        } 
    </style> 
</head> 
  
<body> 
    <h1> 
      GeeksforGeeks 
  </h1> 
    <h2> 
      DOM fieldset disabled Property 
  </h2> 
  
    <form> 
        <div class="titl"> 
            Suggest article for video: 
      </div> 
  
        <fieldset id="GFG"> 
            <legend>JAVA:</legend> 
            Title: 
            <input type="text"> 
            <br> Link: 
            <input type="text"> 
            <br> User ID: 
            <input type="text"> 
        </fieldset> 
  
    </form> 
    <br> 
  
    <button onclick="Geeks()"> 
      Submit 
  </button> 
    <script> 
        function Geeks() { 
            var g =  
                document.getElementById("GFG"); 
  
            /* check the fieldset  
            is disable or not */ 
            g.disabled = true; 
  
            /* name property of fieldset*/ 
            g.name; 
        } 
    </script> 
</body> 
  
</html> 

Output:
Before Clicking On Button:

After Clicking On Button:

Supported Browsers: The browser supported by DOM Fieldset disabled property are listed below:

Google Chrome
Internet Explorer 10.0 +
Firefox
Opera
Safari

My Personal Notes

Recommended Posts: