Text input non-editable

August 14, 2013

If you ever need to make an input field or textarea non-editable the readonly attribute comes in very handy.

When the readonly attribute is present in the markup, it specifies that the user will not be able to modify the value. However the user will still be able to tab to it and copy the text.


<input type="text" name="input" value="Web Design Weekly Rocks!" readonly>

Note: The readonly attribute is ignored if the value of the type attribute is hidden, range, color, checkbox, radio, file, or a button type.