Open In App

HTML | DOM Input Search disabled Property

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Share
Report issue
Report

The DOM Input Search disabled Property in HTML DOM is used to return a boolean value that represents that a search field should be disabled or not. Disabled elements are shown in gray by default and are unusable and un-clickable. 

Syntax: 

  • It returns the disabled property.
searchObject.disabled
  • It is used to set the disabled property.
searchObject.disabled = true/false

Property Values: 

  • true: It specifies the search field is disabled.
  • false:It has a default value. It specifies the search field is not disabled.

Return Value: It returns a boolean value i.e. true if the search field is disabled or false if the search field is not disabled. 

Example-1: This example returns the value of disabled property. 

HTML




<!DOCTYPE html>
<html>
<head>
    <title>
      Input Search disabled Property
      </title>
    <style>
        h1 {
            color: green;
        }
        h2 {
            font-family: Impact;
        }
        body {
            text-align: center;
        }
    </style>
</head>
<body>
    <h1>GeeksforGeeks</h1>
    <h2>Input Search Disabled Property</h2>
    <form id="myGeeks">
        <input type="Search"
               id="test"
               name="myGeeks"
               placeholder="Type to search.."
               disabled>
    </form>
    <br>
    <br>
    <button ondblclick="Access()">
      click here
    </button>
 
    <p id="check"
       style="font-size:24px;
              color:green;">
      </p>
    <script>
        function Access() {
 
            // type="search"
            var s = document.getElementById(
                "test").disabled;
             
            document.getElementById(
                "check").innerHTML = s;
        }
    </script>
</body>
</html>


Output: 

Before Clicking On Button:

  

After Clicking On Button:

  

Example-2: This Example illustrates that how to set the Property. 

HTML




<!DOCTYPE html>
<html>
<head>
    <title>Input Search disabled Property</title>
    <style>
        h1 {
            color: green;
        }
        h2 {
            font-family: Impact;
        }
        body {
            text-align: center;
        }
    </style>
</head>
<body>
    <h1>GeeksforGeeks</h1>
    <h2>Input Search Disabled Property</h2>
    <form id="myGeeks">
        <input type="Search"
               id="test"
               name="myGeeks"
               placeholder="Type to search.."
               disabled>
    </form>
    <br>
    <br>
    <button ondblclick="Access()">
      click here
    </button>
    <p id="check"
       style="font-size:24px;
              color:green;">
      </p>
    <script>
        function Access() {
 
            // type="search"
            var s = document.getElementById(
                "test").disabled = false;
           
            document.getElementById(
                "check").innerHTML = s;
        }
    </script>
</body>
</html>


Output: 

Before Clicking On Button:

  

After Clicking On Button:

  

Supported Browsers: The browser supported by DOM input search disabled Property are listed below:

  • Google Chrome 5 and above
  • Edge 12 and above
  • Firefox 4 and above
  • Opera 10.6 and above
  • Safari 5 and above


Last Updated : 25 Aug, 2022
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads