Monday, March 11, 2013

HTML - Disabled vs. ReadOnly

Key Differences between Disabled and ReadOnly html attributes:

The Disabled attribute

. Values for disabled form elements are not passed to the processor method. The W3C calls this a successful element.(This works similar to form check boxes that are not checked.)
. Some browsers may override or provide default styling for disabled form elements. (Gray out or emboss text) Internet Explorer 5.5 is particularly nasty about this.
. Disabled form elements do not receive focus.
. Disabled form elements are skipped in tabbing navigation.

Example:




The Read Only Attribute

. Not all form elements have a readonly attribute. Most notable, the <SELECT> , <OPTION> , and <BUTTON> elements do not have readonly attributes (although thy both have disabled attributes)
. Browsers provide no default overridden visual feedback that the form element is read only. (This can be a problem… see below.)
. Form elements with the readonly attribute set will get passed to the form processor.
. Read only form elements can receive the focus
. Read only form elements are included in tabbed navigation.

Example: