In HTML, what should happen to a selected, disabled option element?

Question

In my specific example, I'm dealing with a drop-down, e.g.:

<select name="foo" id="bar">
    <option disabled="disabled" selected="selected">Select an item:</option>
    <option>an item</option>
    <option>another item</option>
</select>

Of course, that's pretty nonsensical, but I'm wondering whether any strict behaviour is defined. Opera effectively rejects the 'selected' attribute and selects the next item in the list. All other browsers appear to allow it, and it remains selected.

Update: To clarify, I'm specifically interested in the initial selection. I'm dealing with one of those 'Select an item:'-type drop-downs, in which case the first option is really a label, and an action occurs onchange(). This is fairly well 'progressively enhanced', in that a submit button is present, and only removed via javascript. If the "select..." option were removed, whatever then were to become the first item would not be selectable. Are we just ruling out 'onchange' drop downs altogether, or should the "select..." option be selectable, just with no effect?

Answer 1

I do not think disabled is a standard attribute for the option element. Typically you disable the entire select menu, which is a cross-browser solution. If an element is not selectable, then it should not appear in the select menu.

Edit: Wow, I was sure off on that one. I suppose it does pay to check the spec on occasion.

Answer 2

The HTML specs are a bit vague (ie. completely lacking) with regard to this odd combination. They do say that a form element with the disabled attribute set should not be successful, so it really can't be selected.

The browser may well render it so that it looks selected, but it shouldn't show up in the POSTed data. Looks like Opera's got it right to me.

Answer 3

The HTML specs state that both selected & disabled are available options for the <option> element, but doesn't specify what should happen in case of a conflict. In the section on disabled controls it says

When set, the disabled attribute has the following effects on an element:

• Disabled controls do not receive focus.
• Disabled controls are skipped in tabbing navigation.
• Disabled controls cannot be successful.

it also says

How disabled elements are rendered depends on the user agent. For example, some user agents "gray out" disabled menu items, button labels, etc. In this example, the INPUT element is disabled. Therefore, it cannot receive user input nor will its value be submitted with the form.

While this specific case isn't specified, my reading of this says that the actual rendering of a 'selected' 'disabled' element is left up to the browser. As long as the user cannot select it then it's working as standard. It does say that a script can act upon the element, so it is possible for Javascript to set a disabled option as selected (or disable a selected option). This isn't contrary to the standards, but on form submission, that option's value couldn't be the selected value. The select list would (I assume) have to have an empty value in this case.

Answer 4

According to the HTML 4.01 Specification, disabled is a standard attribute for the option element, but behavior is probably indeterminate based on the standard (read over the information on the select element and the options elements. Here is a portion I think may shed light on Opera's reasons for their implementation:

When set, the disabled attribute has the following effects on an element:
* Disabled controls do not receive focus.
* Disabled controls are skipped in tabbing navigation.
* Disabled controls cannot be successful.

So, it is very likely that this is just one of those things where the spec is vague enough to allow for both interpretations. This is the kind of idiosyncrasy that makes programming for the web so fun and rewarding. :P

Answer 5

In reply to the update in the question, I would say that the 'label' option should be selectable but either make it do nothing on submission or via JavaScript, don't allow the form to be submitted without a value being selected (assuming it's a required field).

From a usablilty point of view I'd suggest doing both, that way all bases are covered.

Answer 6

Are we just ruling out 'onchange' drop downs altogether, or should the "select..." option be selectable, just with no effect?

"onchange" drop-downs are frowned upon by more standards-obsessed types.

I would typically do some client-side validation. "Please select an item from the drop down" kind of thing. i.e.

should the "select..." option be selectable, just with no effect?

So I just said "Yes" to your A or B question. :/ Sorry!

Answer 7

unfortunately it doesn't really matter what should happen, because IE doesn't support the disabled attribute on options period.

http://webbugtrack.blogspot.com/2007/11/bug-293-cant-disable-options-in-ie.html