The HTML DOM Input Search readOnly property is used for setting or returning if the input search field is read-only or not. The readOnly property makes the element non-editable but it can still be focused by tab or click. If there is a default value inside a read-only element then it is sent to server on submit.
Syntax
Following is the syntax for −
Setting the readOnly property −
searchObject.readOnly = true|false
Here, true represents the search field is read only while false represents otherwise. The readOnly property is set to false by default.
Example
Let us look at an example for the Search readOnly property −
<!DOCTYPE html>
<html>
<body>
<h1>Search readOnly property</h1>
<form>
FRUITS: <input type="search" id="SEARCH1" name="fruits">
</form>
<p>Change the readOnly property of the above field by clicking the below button</p>
<button onclick="changeRead()">CHANGE</button>
<script>
function changeRead() {
document.getElementById("PASS1").readOnly = true;
}
</script>
</body>
</html>Output
This will produce the following output −
On clicking the CHANGE button −
