By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,360 Members | 2,961 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,360 IT Pros & Developers. It's quick & easy.

Radio Button Loop inside Form Element Loop

P: n/a
I have a for loop seen below....

var the_form = document.getElementById(formName);
for(var i=0; i<the_form.length; i++)
{
var temp = the_form.elements[i].type;
if (temp == "radio")
{
for (x = 0; x < the_form.elements[i].length - 1; x++)
{
//do stuff
}
}
}
Right before the inside loop I do the following and next to its the
results, any idea why the last one returns 0?
alert(the_form.elements[i].id); // returns question1
alert(the_form.question1.length); // returns 4 (amount of radio
buttons in that group)
alert(the_form.elements[i].length); // returns 0

I cannot figure out why this is the case. Am I blatantly looking over
something?

Oct 13 '06 #1
Share this Question
Share on Google+
9 Replies


P: n/a

wreed wrote:
I have a for loop seen below....

var the_form = document.getElementById(formName);
for(var i=0; i<the_form.length; i++)
{
var temp = the_form.elements[i].type;
if (temp == "radio")
{
for (x = 0; x < the_form.elements[i].length - 1; x++)
{
//do stuff
}
}
}
Right before the inside loop I do the following and next to its the
results, any idea why the last one returns 0?
alert(the_form.elements[i].id); // returns question1
alert(the_form.question1.length); // returns 4 (amount of radio
buttons in that group)
alert(the_form.elements[i].length); // returns 0

I cannot figure out why this is the case. Am I blatantly looking over
something?
What exactly are you trying to accomplish here?

Oct 13 '06 #2

P: n/a

kniza...@gmail.com wrote:
What exactly are you trying to accomplish here?
Well I am using an AHAH library (flavor of Ajax) to do my loading of
content into div's. In this case I am adding in form validation and
the way the library is written I have to do some validation this way.
Basically I am trying to tell if a radio button in the list is selected
and I want to add some HTML into a span if no radio button is selected.
Does that make sense?

Oct 13 '06 #3

P: n/a

wreed wrote:
kniza...@gmail.com wrote:
What exactly are you trying to accomplish here?

Well I am using an AHAH library (flavor of Ajax) to do my loading of
content into div's. In this case I am adding in form validation and
the way the library is written I have to do some validation this way.
Basically I am trying to tell if a radio button in the list is selected
and I want to add some HTML into a span if no radio button is selected.
Does that make sense?
OOps I am basically trying to loop through each radio button list ( I
have more than one) in this form elements collection.

Oct 13 '06 #4

P: n/a
wreed wrote:
wreed wrote:
kniza...@gmail.com wrote:
What exactly are you trying to accomplish here?
Well I am using an AHAH library (flavor of Ajax) to do my loading of
content into div's. In this case I am adding in form validation and
the way the library is written I have to do some validation this way.
Basically I am trying to tell if a radio button in the list is selected
and I want to add some HTML into a span if no radio button is selected.
Does that make sense?

OOps I am basically trying to loop through each radio button list ( I
have more than one) in this form elements collection.
one way to do it would be to just loop over the radio button's
themselves:

<script type="text/javascript">
function test() {
q1Radios = document.the_form.question1;
for (x=0; x < q1Radios.length; x++) {
if ( q1Radios[x].checked )
alert(q1Radios[x].value)
}
}
</script>

<form name="the_form">
<input type="radio" name="question1" value="1" />
<input type="radio" name="question1" value="2" />
<input type="radio" name="question1" value="3" />
<br />
<input type="button" onclick="test();" value="test" />
</form>

Oct 13 '06 #5

P: n/a

kniza...@gmail.com wrote:
wreed wrote:
wreed wrote:
kniza...@gmail.com wrote:
What exactly are you trying to accomplish here?
>
Well I am using an AHAH library (flavor of Ajax) to do my loading of
content into div's. In this case I am adding in form validation and
the way the library is written I have to do some validation this way.
Basically I am trying to tell if a radio button in the list is selected
and I want to add some HTML into a span if no radio button is selected.
Does that make sense?
OOps I am basically trying to loop through each radio button list ( I
have more than one) in this form elements collection.

one way to do it would be to just loop over the radio button's
themselves:

<script type="text/javascript">
function test() {
q1Radios = document.the_form.question1;
for (x=0; x < q1Radios.length; x++) {
if ( q1Radios[x].checked )
alert(q1Radios[x].value)
}
}
</script>

<form name="the_form">
<input type="radio" name="question1" value="1" />
<input type="radio" name="question1" value="2" />
<input type="radio" name="question1" value="3" />
<br />
<input type="button" onclick="test();" value="test" />
</form>
I need to reference the elements though, if I use q1Radios =
the_form.elements[i] it does not work anymore, I am originally looping
through the elements and need to reference the radio buttons as an
element.

Oct 13 '06 #6

P: n/a

one way to do it would be to just loop over the radio button's
themselves:

<script type="text/javascript">
function test() {
q1Radios = document.the_form.question1;
for (x=0; x < q1Radios.length; x++) {
if ( q1Radios[x].checked )
alert(q1Radios[x].value)
}
}
</script>

<form name="the_form">
<input type="radio" name="question1" value="1" />
<input type="radio" name="question1" value="2" />
<input type="radio" name="question1" value="3" />
<br />
<input type="button" onclick="test();" value="test" />
</form>

I need to reference the elements though, if I use q1Radios =
the_form.elements[i] it does not work anymore, I am originally looping
through the elements and need to reference the radio buttons as an
element.
the code i posted does reference the radio buttons as elements, i guess
i dont understand why it has to be processed while looping thru all of
the form elements

Oct 13 '06 #7

P: n/a

kniza...@gmail.com wrote:
>
one way to do it would be to just loop over the radio button's
themselves:
>
<script type="text/javascript">
function test() {
q1Radios = document.the_form.question1;
for (x=0; x < q1Radios.length; x++) {
if ( q1Radios[x].checked )
alert(q1Radios[x].value)
}
}
</script>
>
<form name="the_form">
<input type="radio" name="question1" value="1" />
<input type="radio" name="question1" value="2" />
<input type="radio" name="question1" value="3" />
<br />
<input type="button" onclick="test();" value="test" />
</form>
I need to reference the elements though, if I use q1Radios =
the_form.elements[i] it does not work anymore, I am originally looping
through the elements and need to reference the radio buttons as an
element.

the code i posted does reference the radio buttons as elements, i guess
i dont understand why it has to be processed while looping thru all of
the form elements
I cannot hardcode the radio button id is what I mean I need to
reference it as elements[i] I am trying to make this code scalable.
q1Radios = document.the_form.question1;

Oct 13 '06 #8

P: n/a
I cannot hardcode the radio button id is what I mean I need to
reference it as elements[i] I am trying to make this code scalable.
q1Radios = document.the_form.question1;
will this work for you?

<script type="text/javascript">
function test() {
getRadios = document.getElementsByTagName("input")
for (x=0; x < getRadios.length; x++) {
if ( getRadios[x].type == "radio" && getRadios[x].checked )
alert(getRadios[x].value)
}
}
</script>

<form name="the_form">
<input type="radio" name="question1" value="1" />
<input type="radio" name="question1" value="2" />
<input type="radio" name="question1" value="3" />
<br />
<input type="button" onclick="test();" value="test" />
</form>

Oct 13 '06 #9

P: n/a

kn******@gmail.com wrote:
I cannot hardcode the radio button id is what I mean I need to
reference it as elements[i] I am trying to make this code scalable.
q1Radios = document.the_form.question1;

will this work for you?

<script type="text/javascript">
function test() {
getRadios = document.getElementsByTagName("input")
for (x=0; x < getRadios.length; x++) {
if ( getRadios[x].type == "radio" && getRadios[x].checked )
alert(getRadios[x].value)
}
}
</script>

<form name="the_form">
<input type="radio" name="question1" value="1" />
<input type="radio" name="question1" value="2" />
<input type="radio" name="question1" value="3" />
<br />
<input type="button" onclick="test();" value="test" />
</form>
This solution works great thanks, but my only thing is I lose my
ability to have the text area's in the collection called getradios. No
would the logical thing be to do two collections and add them together?
i.e.
getRadios = document.getElementsByTagName("input")
getTextAreas = document.getElementsByTagName("textarea")

then do some sort of getRadios.add ??? Adding collections together is
that the right way to do it or is there a better way?

Oct 16 '06 #10

This discussion thread is closed

Replies have been disabled for this discussion.