Javascript unable to retrieve radio button value

RESOLVED WORKSFORME

Status

()

Firefox
Untriaged
RESOLVED WORKSFORME
5 years ago
5 years ago

People

(Reporter: tristan.wh33t, Unassigned)

Tracking

16 Branch
x86
Windows XP
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

Attachments

(1 attachment, 1 obsolete attachment)

(Reporter)

Description

5 years ago
Created attachment 682811 [details]
Failed_javascript.html

User Agent: Mozilla/5.0 (Windows NT 5.1; rv:16.0) Gecko/20100101 Firefox/16.0
Build ID: 20121024073032

Steps to reproduce:

Trying to do a simple Javascript call to discover the selected value of a radio button.




Actual results:

Check out this page here: http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_radio_value

That's essentially the exact same thing I'm trying to do. Have a radio button array hold three different values. Then during an onclick or onchange event I want to simply retrieve the value of the selected element in the radio button array. As you can see from the link I've posted it always reports Red, even when no radio button has been selected or blue or green is selected.


Expected results:

It should be retrieving what ever value is selected in the radio button array.

Comment 1

5 years ago
Created attachment 682818 [details]
Testcase: alert selected radio button onchange

Neither the original attachment nor the code in the link given in comment 0 are correct for doing the desired behaviour. The code in this attachment is one correct method of doing it, and the following line in http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_radio_value 

var x=document.getElementById("red").value;

needs to be changed to the following to do the correct thing:

var x=document.querySelector('input[name="colors"]:checked').value;
Attachment #682811 - Attachment is obsolete: true

Comment 2

5 years ago
Resolving per comment 1
Status: UNCONFIRMED → RESOLVED
Last Resolved: 5 years ago
Resolution: --- → WORKSFORME
(Reporter)

Comment 3

5 years ago
(In reply to Mardeg from comment #1)
> Created attachment 682818 [details]
> Testcase: alert selected radio button onchange
> 
> Neither the original attachment nor the code in the link given in comment 0
> are correct for doing the desired behaviour. The code in this attachment is
> one correct method of doing it, and the following line in
> http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_radio_value 
> 
> var x=document.getElementById("red").value;
> 
> needs to be changed to the following to do the correct thing:
> 
> var x=document.querySelector('input[name="colors"]:checked').value;

Thank you. I was not aware that's how it's supposed to be done now. I have been using the method in Comment 0 for a long time and it has worked. I will use the technique you supplied. Is there any way I can look up what is the "right" and wrong way to do things like this?
Status: RESOLVED → UNCONFIRMED
Resolution: WORKSFORME → ---
(Reporter)

Comment 4

5 years ago
(In reply to tristan.wh33t from comment #3)
> (In reply to Mardeg from comment #1)
> > Created attachment 682818 [details]
> > Testcase: alert selected radio button onchange
> > 
> > Neither the original attachment nor the code in the link given in comment 0
> > are correct for doing the desired behaviour. The code in this attachment is
> > one correct method of doing it, and the following line in
> > http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_radio_value 
> > 
> > var x=document.getElementById("red").value;
> > 
> > needs to be changed to the following to do the correct thing:
> > 
> > var x=document.querySelector('input[name="colors"]:checked').value;
> 
> Thank you. I was not aware that's how it's supposed to be done now. I have
> been using the method in Comment 0 for a long time and it has worked. I will
> use the technique you supplied. Is there any way I can look up what is the
> "right" and wrong way to do things like this?
Status: UNCONFIRMED → RESOLVED
Last Resolved: 5 years ago5 years ago
Resolution: --- → WORKSFORME

Comment 5

5 years ago
(In reply to tristan.wh33t from comment #3)
> Thank you. I was not aware that's how it's supposed to be done now. I have
> been using the method in Comment 0 for a long time and it has worked. I will
> use the technique you supplied. Is there any way I can look up what is the
> "right" and wrong way to do things like this?

Sure, the .checked boolean value I used in the attachment is covered along with others at https://developer.mozilla.org/en-US/docs/DOM/HTMLInputElement
and the :checked CSS selector I used in the comment is covered at
https://developer.mozilla.org/en-US/docs/CSS/:checked

You can also always use an IRC client to ask more questions in the irc://irc.mozilla.org/js channel to help determine if something is a bug or not before filing in bugzilla.
You need to log in before you can comment on or make changes to this bug.