Groups | Search | Server Info | Keyboard shortcuts | Login | Register [http] [https] [nntp] [nntps]

Groups > comp.lang.javascript > #22063 > unrolled thread

Syntax to access the selected option's value

Back to article view | Back to comp.lang.javascript

Contents

  Syntax to access the selected option's value Bart Van der Donck <bart@nijlen.com> - 2013-11-19 06:20 -0800
    Re: Syntax to access the selected option's value "Michael Haufe (TNO)" <tno@thenewobjective.com> - 2013-11-19 08:27 -0800
    Re: Syntax to access the selected option's value Christoph Michael Becker <cmbecker69@arcor.de> - 2013-11-19 18:26 +0100
      Re: Syntax to access the selected option's value Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-11-19 19:55 +0100
        Re: Syntax to access the selected option's value Ben Bacarisse <ben.usenet@bsb.me.uk> - 2013-11-19 19:18 +0000
          Re: Syntax to access the selected option's value Thomas 'PointedEars' Lahn <PointedEars@web.de> - 2013-11-19 22:48 +0100
    Re: Syntax to access the selected option's value "Jukka K. Korpela" <jkorpela@cs.tut.fi> - 2013-11-19 19:32 +0200
      Re: Syntax to access the selected option's value Bart Van der Donck <bart@nijlen.com> - 2013-11-20 02:40 -0800
        Re: Syntax to access the selected option's value Christoph Michael Becker <cmbecker69@arcor.de> - 2013-11-21 22:27 +0100

#22063 — Syntax to access the selected option's value

Hello,

Say the following code:

 <form name="f" method="get">
  <select name="myName" id="myID">
   <option value="a">a</option>
   <option value="b">b</option>
   <option value="c">c</option>
  </select>
 </form>

There are two 'official' ways to read out the current selected value:

 document.getElementById('myID').value
 document.f.myName.options[document.f.myName.selectedIndex].value

But I can't find any reasonable environment where the following fails:

 document.f.myName.value

This is the same syntax as <input type="text|checkbox|hidden|...">, and thus presumably seductive to many.

Thanks,

-- 
 Bart

[toc] | [next] | [standalone]

#22067

On Tuesday, November 19, 2013 8:20:43 AM UTC-6, Bart Van der Donck wrote:

[...]
> 
> Say the following code:
> 
>  <form name="f" method="get">
>   <select name="myName" id="myID">
>    <option value="a">a</option>
>    <option value="b">b</option>
>    <option value="c">c</option>
>   </select>
>  </form>
> 
> There are two 'official' ways to read out the current selected value:
> 
>  document.getElementById('myID').value
>  document.f.myName.options[document.f.myName.selectedIndex].value
> 
> But I can't find any reasonable environment where the following fails:
> 
>  document.f.myName.value
> 
> This is the same syntax as <input type="text|checkbox|hidden|...">, and thus presumably seductive to many.

[...]

Is this a question or a comment?

[toc] | [prev] | [next] | [standalone]

#22069

Bart Van der Donck wrote:

> Say the following code:
> 
> <form name="f" method="get"> <select name="myName" id="myID"> <option
> value="a">a</option> <option value="b">b</option> <option
> value="c">c</option> </select> </form>
> 
> There are two 'official' ways to read out the current selected
> value:
> 
> document.getElementById('myID').value 
> document.f.myName.options[document.f.myName.selectedIndex].value

It seems reasonable to distinguish between referencing the form element
and accessing its value.  The latter is explained in this NG's FAQ[1],
the former in a side note to the FAQ[2].

> But I can't find any reasonable environment where the following
> fails:
> 
> document.f.myName.value

As explained in the FAQ[1], this would fail under NN4, for instance.

> This is the same syntax as <input type="text|checkbox|hidden|...">,
> and thus presumably seductive to many.

[1] <http://pointedears.de/scripts/faq/cljs/#formControlAccess>
[2] <http://pointedears.de/scripts/faq/cljs/faq_notes/form_access.html>

-- 
Christoph M. Becker

[toc] | [prev] | [next] | [standalone]

#22072

Christoph Michael Becker wrote:

> Bart Van der Donck wrote:
>> Say the following code:
>> 
>> <form name="f" method="get"> <select name="myName" id="myID"> <option
>> value="a">a</option> <option value="b">b</option> <option
>> value="c">c</option> </select> </form>
>> 
>> There are two 'official' ways to read out the current selected
>> value:
>> 
>> document.getElementById('myID').value
>> document.f.myName.options[document.f.myName.selectedIndex].value
> 
> It seems reasonable to distinguish between referencing the form element
> and accessing its value.  The latter is explained in this NG's FAQ[1],
> the former in a side note to the FAQ[2].

However, the “official“, i.e. *both* standards-compliant and backwards-
compatible approach is

  var el = document.form["f"].elements["myName"];
  el.options[el.selectedIndex].value

but it only works for el.type == "select-one", and it is necessary to check 
that el.selectedIndex is not out of bounds; at least, that it is not 
negative.

>> But I can't find any reasonable environment where the following
>> fails:
>> 
>> document.f.myName.value
> 
> As explained in the FAQ[1], this would fail under NN4, for instance.

It also fails under certain circumstances in IE/MSHTML.
 
-- 
PointedEars

Twitter: @PointedEars2
Please do not Cc: me. / Bitte keine Kopien per E-Mail.

[toc] | [prev] | [next] | [standalone]

#22073

Thomas 'PointedEars' Lahn <PointedEars@web.de> writes:
<snip>

Typo:
>   var el = document.form["f"].elements["myName"];
                          ^s
>   el.options[el.selectedIndex].value

<snip>
-- 
Ben.

[toc] | [prev] | [next] | [standalone]

#22076

Ben Bacarisse wrote:

> Thomas 'PointedEars' Lahn <PointedEars@web.de> writes:
> <snip>
> 
> Typo:
>>   var el = document.form["f"].elements["myName"];
>                           ^s
>>   el.options[el.selectedIndex].value

Exactly.  Thanks.

-- 
PointedEars

Twitter: @PointedEars2
Please do not Cc: me. / Bitte keine Kopien per E-Mail.

[toc] | [prev] | [next] | [standalone]

#22070

2013-11-19 16:20, Bart Van der Donck wrote:

> There are two 'official' ways to read out the current selected value
 > [ of a select element ]
>
>   document.getElementById('myID').value
>   document.f.myName.options[document.f.myName.selectedIndex].value

It's rather difficult to say what is or is not official in DOMland in 
general, but those ways are probably as official as you can get.

> But I can't find any reasonable environment where the following fails:
>
>   document.f.myName.value

Well, why should you? It's reasonable close to being official:

"The value IDL attribute [of a select element], on getting, must return 
the value of the first option element in the list of options in tree 
order that has its selectedness set to true, if any. If there isn't one, 
then it must return the empty string."

http://www.w3.org/TR/html5/forms.html#dom-select-value

-- 
Yucca, http://www.cs.tut.fi/~jkorpela/

[toc] | [prev] | [next] | [standalone]

#22080

Jukka K. Korpela wrote:

> "The value IDL attribute [of a select element], on getting, must return 
> the value of the first option element in the list of options in tree 
> order that has its selectedness set to true, if any. If there isn't one, 
> then it must return the empty string."
> http://www.w3.org/TR/html5/forms.html#dom-select-value

That's the hyperlink I was looking for, thanks. I think you're right; one shouldn't expect "document.f.myName.value" to fail. But still, other approaches are more recommended/traditional, maybe the classic forms[x].elements[y] on top. But there is more than one way to do it.

I would even go a step further. Under the initial hypothesis that  "document.getElementById('myID').value"  is 'official',  "document.f.myName.value"  must be 'official' as well. W3 only speaks vaguely about "getting" the value-attribute. Nothing is said about whether the value-attribute should be accessed by ID or NAME, and, in both cases, how then.

-- 
 Bart

[toc] | [prev] | [next] | [standalone]

#22106

Bart Van der Donck wrote:

> I would even go a step further. Under the initial hypothesis that
> "document.getElementById('myID').value"  is 'official',
> "document.f.myName.value"  must be 'official' as well. W3 only speaks
> vaguely about "getting" the value-attribute. Nothing is said about
> whether the value-attribute should be accessed by ID or NAME, and, in
> both cases, how then.

The W3C is quite clear about this.  The "value-attribute" you're
referring to, is the value property of the HTMLSelectElement
interface[1].  How to get a reference to an object implementing this
HTMLSelectElement interface is a completely different issue, AISB.
Using the shortcut accessors (e.g. document.f) should not be regarded
"official", because they are not part of the W3C (HTML) DOM specifications.

[1] <http://www.w3.org/TR/html5/forms.html#the-select-element>

-- 
Christoph M. Becker

[toc] | [prev] | [standalone]

Back to top | Article view | comp.lang.javascript

csiph-web