Bug Tracker

Opened 7 years ago

Closed 7 years ago

Last modified 4 years ago

#7981 closed bug (worksforme)

Setting "selected" attribute to false should have no effect in single line <select>

Reported by: anonymous Owned by: jitter
Priority: low Milestone: 1.5.1
Component: attributes Version: 1.5
Keywords: Cc:
Blocked by: Blocking:

Description (last modified by jitter)

Hi. I filed this bug (if it is one) also at the WekKit Project (https://bugs.webkit.org/show_bug.cgi?id=52436) since I don't know who is responsible for this behaviour.

(I am using Ubuntu 10.04) I got a <select> element with three <option> inside (my page ist XHTML 1.0 Transitional), looks like this:

<select>
  <option value="0">0</option>
  <option value="1">1</option>
  <option value="2">2</option>
</select>

None of those is selected manually (i.e. has the "selected='selected'" tag) but on first loading the page, the option "0" ist shown by default. When I use jQuery to delete all "selected" tags in all <option>-element (which are not there), suddenly no option is selected anymore. You can check it yourself with following (w3c validated) little code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
    <title>test</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
</head>
<body>
    <select id="s" size="1">
        <option value="0">0</option>
        <option value="1">1</option>
        <option value="2">2</option>
    </select>
    <input id="i" type="button" value="Remove 'selected'"/>
    <script type="text/javascript">
    $(document).ready(function() {
        $("#i").click(function() {
            $("#s").find("option").removeAttr("selected");
        });
    });
    </script>
</body>
</html>

This disappearing of a selected value happens in Google Chrome 8.0.552.237, Chromium 10.0.639.0 (71411) as well as Safari 5.0.3 (7533.19.4). You see, pretty new browsers. According to webkit.org the webkit version of Chromium is 534.16 but the newest webkit version is r75294. So I can't really tell if I got the newest one, it's a confusing name scheme. This behaviour, however, does not appear in Firefox 3.6.13, Opera 11.00 or Internet Explorer 8.

I think that the way Firefox, Opera and IE handle this is the correct way. Could you please check if this is a bug in WebKit?

Best regards, Christian

Change History (9)

comment:1 Changed 7 years ago by jitter

Component: unfiledmanipulation
Description: modified (diff)
Priority: undecidedlow

Thanks for taking the time to contribute to the jQuery project by writing a bug report.

I looked into this and (as Alexey Proskuryakov on the webkit bug tracker already pointed out) this isn't an issue with removeAttr() directly but with WebKit acting strange differntly when you set the selected property of a DOM option element to false (or "").


Why does jQuery do jQuery.attr( this, name, "" ); in removeAttr()?

jQuery does this to fix a bug in some IE versions which don't handle calls to removeAttribute( name ) correctly. For more insight into this check the ticket #464 (corresponding commit). This was already done in December 2006 and has been in jQuery since version 1.0.4.

Also this test case (with jQuery 1.0.3 which didn't yet include this fix) shows (e.g. in IE 6) that .removeAttr() needs this fix in IE. You can also check out the still active test case link in the original ticket.


Is this really a jQuery issue?

I don't think so. This can also be triggered in WebKit without the use of jQuery by plain javascript. The code also isn't artificial but a legitimate use case.

test case with a single option
test case with two options (2nd has selected set)

Both test cases show the same behavior in WebKit. On opening the page the correct option element is shown preselected. After clicking the button no option is shown as selected and the selectedIndex property of the parent select return -1.


Is WebKit doing the wrong thing?

That is a though call. If you look at the specifications of select/option in HTML 4.01 and DOM Level 2 this behavior could be seen as "not incorrect" (but neither are the other browsers incorrect). Check the following
DOM Level 2 - selectedIndex
HTML 4.01 - Pre-selected options

You could argue that having no option shown selected and selectedIndex set to -1 is a correct way of reacting to all option DOM elements having set their selected property to false explicitly.


If we look at the newer specifications HTML5 select DOM Interface - selectedIndex and the following text from HTML5 - 4.10.9 The select element

If [...] the element's display size is 1, then whenever there are no option elements in the select element's list of options that have their selectedness set to true, the user agent must set the selectedness of the first option element in the list of options in tree order that is not disabled, if any, to true.

I would argue that how Opera/FF,IE behave is the correct way to go. Of course I might have missed some very important points in the specifications as this was just a quick check. Feel free to correct me.


Is this going to be fixed in jQuery

Maybe. I might take some time to investigate which browsers really need this .attr( this, name, "" ) workaround and build in a check to run this only for the browsers which need it. Because skipping this step would bring performance improvements if you call .removeAttr() on many elements. So the fix would be "coincidental" and the underlying "issue" with WebKit would remain. (e.g. $("option").attr("selected", "");).

So until we decide if the perf improvement to removeAttr() is worth it I leave this ticket open.

Last edited 7 years ago by jitter (previous) (diff)

comment:2 Changed 7 years ago by jitter

Keywords: needsreview added

comment:3 Changed 7 years ago by jitter

Milestone: 1.next1.5.1
Owner: set to jitter
Status: newassigned
Version: 1.4.41.5

comment:4 Changed 7 years ago by jitter

Component: manipulationattributes

comment:5 Changed 7 years ago by anonymous

The underlying issue/bug in webkit was fixed in the newest release. So take your time. :)

comment:6 Changed 7 years ago by anonymous

in jquery min you just need change line to: a.setAttribute(c,e) from a[c]=e

in not minified version: elem[ name ] = value;

change with: elem.setAttribute( name, value );

comment:7 Changed 7 years ago by timmywil

It seems that webkit has fixed the issue for us: http://jsfiddle.net/timmywil/pRmQN/

comment:8 Changed 7 years ago by timmywil

Keywords: needsreview removed
Resolution: worksforme
Status: assignedclosed

comment:9 Changed 4 years ago by anonymous

you can set it by $("#select_id").prop("selectedIndex", 3); Select index starts from zero.

read here for example.

http://kvcodes.com/2014/03/set-html-select-options-selected-value-using-jquery/

Note: See TracTickets for help on using tickets.