Skip to content
Related Articles

Related Articles

HTML | DOM Input Checkbox disabled Property
  • Difficulty Level : Basic
  • Last Updated : 06 Mar, 2019

The Input Checkbox disabled property in HTML DOM is used to set or return whether the Input Checkbox field must be disabled or not. A disabled checkbox is unclickable and unusable. It is a boolean attribute and used to reflect the HTML Disabled attribute.

Syntax:

  • It returns the Input Checkbox disabled property.
    checkboxObject.disabled
  • It is used to set the Input Checkbox disabled property.
    checkboxObject.disabled = true|false
  • Property Values: It contains two property values which are listed below:

    • true: It defines that the checkbox is disabled.
    • False: It has the default value. It defines that the checkbox is not disabled.

    Return Value: It returns a boolean value which represents the checkbox is disabled or not.

    Example 1: This example sets the Input Checkbox disabled property.






    <!DOCTYPE html> 
    <html
        <head
            <title>
                DOM Input Checkbox disabled Property
            </title
        </head
          
        <body style="text-align:center;"
          
            <h1 style="color:green;">
                GeeksforGeeks
            </h1
              
            <h2>DOM Input Checkbox disabled Property</h2>
              
            <form id="myGeeks"
              
                <!-- Below input elements have attribute
                    checked -->
                <input type="checkbox" name="check" id="GFG"
                        value="1" disabled>Checked by default<br>
                          
                <input type="checkbox" name="check" value="2">
                        Not checked by default<br
            </form><br>
              
            <button onclick="myGeeks()">
                Submit
            </button>
              
            <!-- Script to disable checkbox -->
            <script>
                function myGeeks() {
                    var g = document.getElementById("GFG").disabled
                            = false;
                }
            </script>
        </body
    </html>                                

    
    

    Output:
    Before clicking on the Button:

    After clicking on the Button:

    Example 2: This example returns the Input Checkbox disabled property.




    <!DOCTYPE html> 
    <html
        <head
            <title>
                DOM Input Checkbox disabled Property
            </title
        </head
          
        <body style="text-align:center;"
          
            <h1 style="color:green;">
                GeeksforGeeks
            </h1
              
            <h2>DOM Input Checkbox disabled Property</h2
              
            <form id="myGeeks">
                   
                <!-- Below input elements have attribute
                    checked -->
                <input type="checkbox" name="check" id="GFG" 
                        value="1" disabled>Checked by default<br
                          
                <input type="checkbox" name="check" value="2">
                        Not checked by default<br
            </form><br>
              
            <button onclick="myGeeks()">
                Submit
            </button>
              
            <p id="sudo" style="color:green;font-size:25px;"></p>
              
            <!-- Script to return Input Checkbox disabled Property -->
            <script>
                function myGeeks() {
                    var g = document.getElementById("GFG").disabled;
                    document.getElementById("sudo").innerHTML = g;
                }
            </script>
        </body
    </html>                              

    
    

    Output:
    Before clicking on the Button:

    After clicking on the Button:

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

    • Google Chrome
    • Internet Explorer
    • Firefox
    • Opera
    • Safari

    full-stack-img

    My Personal Notes arrow_drop_up
Recommended Articles
Page :