View video tutorial

HTML readonly Attribute

HTML

The HTML readonly attribute is a Boolean attribute that specifies an input field or text area that cannot be changed by the user.

Definition and Usage


➔ The value of a readable field is still submitted with the form data, but the value of a disabled field is not submitted.

➔ <input readonly> or <input readonly="readonly"> is equivalent.

Syntax
//In HTML
<form action="/#">
    Name: <input type="text" id="name" name="name" value="M John"><br>
    Email: <input type="email" id="email" name="email" value="mjohn@example.com" readonly><br><br>
    <input type="submit" value="Submit">
</form>

//In Javascript
let element=document.querySelector("#name");
element.readOnly = true;
//OR
element.setAttribute('readonly', true);
//OR
element.removeAttribute('readonly');

Applies to

This attribute can be used on the following element.

Attribute Element
readonly <input>, <textarea>