Radio Button Loop inside Form Element Loop

[wreed]

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.type;
if (temp == "radio")
{
for (x = 0; x < the_form.elements.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.id); // returns question1
alert(the_form.question1.length); // returns 4 (amount of radio
buttons in that group)
alert(the_form.elements.length); // returns 0

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

 

[knizacky]

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.type;
if (temp == "radio")
{
for (x = 0; x < the_form.elements.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.id); // returns question1
alert(the_form.question1.length); // returns 4 (amount of radio
buttons in that group)
alert(the_form.elements.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?

 

[wreed]

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?

 

[wreed]

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.

 

[knizacky]

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>

 

[wreed]

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 it does not work anymore, I am originally looping
through the elements and need to reference the radio buttons as an
element.

 

[knizacky]

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 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

 

[wreed]

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 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 am trying to make this code scalable.
q1Radios = document.the_form.question1;

 

[knizacky]

I cannot hardcode the radio button id is what I mean I need to

reference it as elements 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>

 

[wreed]

I cannot hardcode the radio button id is what I mean I need to
reference it as elements 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?