HTML | DOM Input Radio disabled Property

17 Oct, 2019
The DOM Input Radio disabled Property is used to set or return whether the Radio Button must be disabled or not. A disabled Radio Button is un-clickable and unusable. It is a boolean attribute and used to reflect the HTML Disabled attribute. It is usually rendered in grey color by default in all the Browsers.
Syntax:
It returns the disabled property.radioObject.disabled
radioObject.disabled
It is used to set the disabled property.radioObject.disabled = true|false
radioObject.disabled = true|false
Property Values:
true: It defines that the Input Radio Button is disabled.
False: It has a default value. It defines that the Radio Button is not disabled.
Return Value: It returns a boolean value which represents that the Radio Button is disabled or not.
Example-1: This Example illustrates how to return the Property.
<!DOCTYPE html><html>  <head>    <style>        body {            text-align: center;        }                  h1 {            color: green;        }    </style></head>  <body>    <h1>      GeeksforGeeks  </h1>      <h2>      HTML DOM Input Radio Disabled Property  </h2>      <form id="myGeeks">        Radio Button:        <input type="radio"                checked=true               id="radioID"                value="Geeks_radio"               name="Geek_radio"                disabled>        <br>        <br>    </form>    <button onclick="GFG()">        Click!    </button>    <p id="GFG"        style="font-size:25px;              color:green;">  </p>    <script>        function GFG() {              // Accessing input element             // type="radio"             var x =                document.getElementById(                  "radioID").disabled;                        document.getElementById(              "GFG").innerHTML = x;        }    </script>  </body>  </html>
Output:Before Clicking On Button:
After Clicking On Button :
Example-2: This Example illustrates how to set the Disabled Property.
<!DOCTYPE html><html>  <head>    <style>        body {            text-align: center;        }                  h1 {            color: green;        }    </style></head>  <body>    <h1>      GeeksforGeeks  </h1>      <h2>      HTML DOM Input Radio Disabled Property  </h2>      <form id="myGeeks">        Radio Button:        <input type="radio"               checked=true                id="radioID"               value="Geeks_radio"                name="Geek_radio"                disabled>        <br>        <br>    </form>    <button onclick="GFG()">        Click!    </button>    <p id="GFG"        style="font-size:25px;              color:green;">  </p>    <script>        function GFG() {              // Accessing input element             // type="radio"             var x =                document.getElementById(                  "radioID").disabled = "false";                        document.getElementById(              "GFG").innerHTML = x;        }    </script>  </body>  </html>
Output:Before Clicking On Button :
After Clicking On Button :
Supported Browsers: The browser supported by DOM input Radio disabled property are listed below:
Google Chrome
Internet Explorer 10.0 +
Firefox
Opera
Safari
shubham_singh
HTML-DOM
HTML
Web Technologies
HTML
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
How to update Node.js and NPM to next version ?
REST API (Introduction)
CSS to put icon inside an input element in a form
Types of CSS (Cascading Style Sheet)
HTTP headers | Content-Type
Installation of Node.js on Linux
Difference between var, let and const keywords in JavaScript
How to fetch data from an API in ReactJS ?
Differences between Functional Components and Class Components in React
Remove elements from a JavaScript Array