Difference between: disabled and: readonly in HTML?

Disabled does not pass the value to the form, in addition to being unable to edit.

Readonly sends the value to the form and can not edit either.

Assuming you have this html:

<form method="post" action="page.php">
    <input type="text" name="foo" value="foo" disabled="disabled" />
    <input type="text" name="bar" value="bar" readonly="readonly" />
</form>

Your page ' page.php ' will only receive the $_POST['bar']

Disabled you can not edit or get the input value when processing the Form.

Readonly you can at least get the input value in Form processing.

This is the basics. There are a few more nuances:

• In% with% you can not select the value of the field to copy it, unlike Disabled ;
• No Readonly Tab Cursor does not stop in the field, unlike Disabled ;

Just to complement the responses from @ mend3 and @Cigano Morrison Mendez.

Both disabled and readonly are predefined attributes, this means that they do not need to receive value for it to work.

Example:

Disabled:
<br>
<input type="text" placeholder="Apenas Disabled" disabled>
<br>
<input type="text" placeholder="Disabled true" disabled="true">
<br>
<input type="text" placeholder="Disabled false" disabled="false">
<br>
<input type="text" placeholder="Disabled goku" disabled="goku">
<br>Readonly:
<br>
<input type="text" placeholder="Apenas readonly" readonly>
<br>
<input type="text" placeholder="Readonly true" readonly="true">
<br>
<input type="text" placeholder="Readonly false" readonly="false">
<br>
<input type="text" placeholder="Readonly goku" readonly="goku">

It's no use putting false, values are ignored, and the attribute acts as a Boolean, or it is not.

readonly

     

This Boolean attribute indicates that the user can not modify the value   of the control. HTML5 This attribute is ignored if the value of the attribute   type for hidden, range, color, checkbox, radio, file or a type of   button.

disabled 

     

This Boolean attribute indicates that the form control is not   available for interaction. In particular the click event will not be   triggered on disabled controls. In addition, the value of a   The disabled control is not sent with the form.

Source: Attributes of an element