7

UPDATE

Unfortunately I have caused some confusion by talking about the .value property, but then asking for any reference to feature support in browsers.

In hindsight, I guess the thing I needed right now was to know whether .value is "safe" to use, and therefore that is why I accepted @BeatAlex's answer (as they put the effort in to actually test on multiple browser.

ORIGINAL QUESTION

Using javascript, the accepted way to get/set the value of the selected <option> in a <select> is using the .value property.

For years and years I have not used the .value property, as I was told that "old browsers" don't support it. Instead I use the long form of...

dd.options[dd.selectedIndex].value;

But I've just done some research, and I cannot find any reference to which "old browsers" this effects. For instance this quirksmode article even mentions "old browsers" but doesn't give any more information than that.

Which "old browsers" do not have the .value property on the <select> element? Is there a reference somewhere to exactly when particular features became available in mainstream browsers?

Note: unfortunately jQuery is not currently available to me, due to an old 3rd party component being used on the system

Community
  • 1
  • 1
freefaller
  • 19,368
  • 7
  • 57
  • 87
  • http://www.w3schools.com/jsref/prop_option_value.asp Not the answer but can help.... – Bhavik May 15 '14 at 09:31
  • 2
    Sorry @Bhavik, but I absolutely hate w3schools ([see this website for why](http://w3fools.com)), and actually looking at that page doesn't tell anything that I don't already know – freefaller May 15 '14 at 09:34
  • @freefaller wait, are you just looking for http://caniuse.com/ ? – Benjamin Gruenbaum May 15 '14 at 10:06
  • @Benjamin, I'm aware of caniuse.com, but that appears to be purely for HTML5, etc. I tried looking on there for .value, but I couldn't find anything (maybe just not searching for the right thing) – freefaller May 15 '14 at 10:18
  • @freefaller my rule of thumb is that if you can't find its support chart on mdn, caniuse or msdn, and it's not a w3 or whatwg working draft - it's safe to use in all common browsers. Of course, you should consider using something like Karma to cross test your code on all browsers which would make actually verifying this really easy. – Benjamin Gruenbaum May 15 '14 at 10:38

2 Answers2

6

.value works for me in most oldest browsers supported in windows XP.

<select id="select">
  <option value="Hello1">1</option>
  <option value="Hello2">2</option>
  <option value="Hello3">3</option>
  <option value="Hello4">4</option>
  <option value="Hello5">5</option>
</select>

JavaScript:

var id = document.getElementById("select");

id.onchange = function(){
 alert(this.value);
}

This works on:

(All run from Windows XP)

  • IE6

  • Firefox 3.0

  • Safari 4.0

  • Chrome 14.0

  • Opera 10.6

This is as far as Browserstack goes back to.

Albzi
  • 15,431
  • 6
  • 46
  • 63
  • Think I am confused then... @Bhavik – Albzi May 15 '14 at 09:28
  • Thanks @BeatAlex... but what about early versions of Chrome, FireFox, Safari, Opera, etc... all those browser that *could* potentially fail if `.value` is used? – freefaller May 15 '14 at 09:29
  • I'll give you a definite +1 for going to the trouble of testing them all through Browserstack (which I wasn't aware of, and will investigate more!). Still doesn't answer my direct question of if there is any resource that would provide me with the information directly, rather than having to test each and every browser individually – freefaller May 15 '14 at 09:38
  • Are you talking about browsers older than the ones I tested? Or also other browsers that aren't as wildly used? @freefaller – Albzi May 15 '14 at 09:39
  • I'm talking about any browser that one of my users might be using, and weighing up the pro's / con's of one (easier) method over another (safer) method... and how I instruct my team which one to use. Unfortunately there are still a lot of people out there who aren't using the latest browser, and can't be told to – freefaller May 15 '14 at 09:41
  • So Browsers like Netscape? http://bytes.com/topic/javascript/answers/90872-how-get-selected-value-select-using-dom – Albzi May 15 '14 at 09:42
  • @BeatAlex, the bytes.com page discusses the use of `getAttribute('value')` (which should not work, as there is no such *attribute*, just a *property*). – Jukka K. Korpela May 15 '14 at 09:47
  • @BeatAlex, please see my update to the question... I think I have caused confusion, and hopefully that will rectify it. Thanks for your help – freefaller May 15 '14 at 09:54
  • 2
    @freefaller this is that resource which you created when you asked that question causing BeatAlex to go through the trouble of checking it for every browser. Through the next few years this answer will be peer reviewed causing the information in it to be validated over and over, this is how SO works. – Benjamin Gruenbaum May 15 '14 at 10:05
2

It seems that we need to go down to IE 3 to find a browser that does not support the value property for a select element. I found a problem description saying: “I'm having some trouble getting the value of a selected option in IE3.0.2. The following [code that accesses the value property] works in all flavors of Netscape and IE 4” and quoting the IE 3 error message “Value is not an object”.

This means in practice that we can now regard value as universally supported.

Jukka K. Korpela
  • 195,524
  • 37
  • 270
  • 390
  • The most impressive thing is according to that page, IE3 was around in 1902 ;-) Thanks @Jukka, unfortunately it still doesn't answer if there is any sort of reference to when particular features were supported – freefaller May 15 '14 at 09:47
  • please see my update to the question... I think I have caused confusion, and hopefully that will rectify it. Thanks for your help – freefaller May 15 '14 at 09:55
  • I think this is pretty much the best answer to your *original* question, still in bold in it: IE 3 lacked support, IE 4 had it. I don’t think it’s a good idea to change the question, even to a related question (which is actually simpler, as we hardly need to worry about anything older than IE 6 these days). – Jukka K. Korpela May 15 '14 at 12:57