Disabled and Readonly

These two optional attributes for form fields have some similarities and some differences. Their similarities mean that there will never be a need to use both attributes on the same field while their differences will determine which of the two that you need to use.

<input type="text" size="10" id="sz" name="sz" value="size"
readonly="readonly" />
<input type="text" size="10" id="desc" name="desc" value="description"
disabled="disabled"" />

Where the two attributes are similar is that in both instances the input field is no longer an enterable field. The form field is still able to display the value assigned to it ("size" and "description" in the example) and this value is still able to be accessed and changed from any client side scripts (usually Javascript) that is running on the page.

There are two differences between these two attributes. The first is in the way that the fields are normally displayed by web browsers. Normally a readonly field will be displayed exactly the same way as a regular form field except for not allowing the person viewing the page to change the value within the field directly. Disabled fields are normally displayed by web browsers using a greyed out colouring that makes it more obvious that you can't enter anything into the field.

The second difference between the two attributes is that any fields that are disabled are completely ignored when the form is submitted so that any values assigned to those fields are not passed to the form processor. Readonly fields are passed to the form processor as if they were regular user enterable fields.


This article written by Stephen Chapman, Felgall Pty Ltd.

go to top

FaceBook Follow
Twitter Follow