Can't iterate through groups of radio buttons?

JavaScript
1

Hi,

I’ve been looking around the web and forums for the past few days now. Javascript is not my forte but I am beginning to understand more of it. My issue is perhaps in the method that I have tried to concatenate a variable to my radio buttons.

The scenario:

I have about 10 groups of radio buttons , each with 4 options.

radioname1[0]
radioname1[1]
radioname1[2]
radioname1[3]

radioname2[0]
radioname2[1]
etc…

I know how to put a variable into (or more like assign a variable to the array index of a SINGLE radio button group)

document.form.radioname1[i].value

but what I need to know is how to assign a variable to the radioname, so that I can iterate through each radionameVARIABLEHERE[i].value ?

I have been looking and trying to for days. All I really need to know is how to get a variable into the radiobutton name. I know how to use a for loop to get this to iterate through it all but its just the syntax that isn’t playing nice.

Any help on this would be much appreciated ASAP

2

This is a more basic part of javascript. You can use two syntaxes to access an object property.

For example, the length property of an array object can be accessed either like
myArray.length or myArray[“length”]

So,


var name = "radioname1[" + i + "]"; // radioname1[3]
document.form[name].value
3

Thanks I got that part working but I can’t seem to increment the actual “radioname”

I’m trying to iterate through for example 8 radio groups , each group has 4 options.

The issue is not being able to concatenate to the radioname[variablenumberhere][indexhere] , The index bit works but how do I get that variablenumberhere assigned?

I tried :
(note my form radio names are : que1 … que8)

var i = 1;
var currRadio = “que” + i;
document.form.currRadio[i].checked = true;

It should result in : document.form.que1.cheked =true; ? Or at least that is what my intention is.

4

Instead of

var i = 1;
var currRadio = “que” + i;
document.form.currRadio[i].checked = true;

You need it to read

var i = 1;
var currRadio = “que” + i;
document.form[currRadio][j].checked = true;

where j is the particular button within the group you want checked (since i is a part of the name of the group)

5

You’re a LEGEND Felgall, funny I was almost going to contact you on your old site that I stumbled upon earlier, but thought you might have changed your email since that post (it was in 2000) :smiley:

So this is what I did just to test this all out .


<FORM name="form" method="post">
 Question 1
    <INPUT type="radio" name="que1" value="1"> right
    <INPUT type="radio" name="que1" value="0"> wrong<BR>
    Question 2
    <INPUT type="radio" name="que2" value="1"> right
    <INPUT type="radio" name="que2" value="0"> wrong<BR>
    
    
  
   
 </FORM>


<script type="text/javascript">
function check(){
var i = 1;
var j = 1;
var currRadio = "que" + i;
document.form[currRadio][j].checked = true;

}

check();

</script>

Thank you all very much for the help , now to put this in a FOR loop so that I can have a function that will show all the correct answers in a quiz. I will post my findings here.

6

Ok interestingly enough this should work shouldn’t it?


 <FORM name="form" method="post">
 Question 1
    <INPUT type="radio" name="que1" value="1"> right
    <INPUT type="radio" name="que1" value="0"> wrong<BR>
    Question 2
    <INPUT type="radio" name="que2" value="0"> wrong
    <INPUT type="radio" name="que2" value="1"> right<BR>
    
   
 </FORM>


<script type="text/javascript">
function check(){
var i = 1;
var j = 0;
var currRadio = "que" + i;


if (document.form.[currRadio][j].value = 1){
document.form[currRadio][j].checked = true;
}

}

check();

</script>

That If statement should be true, I’ve tried

document.form.[currRadio][j].value = 0

as well but the IF statement does not resolve. When I try manually with


if (document.form.que1[0].value = 1){document.form[currRadio][j].checked = true;  }

It works, but I need to use the variables like i’ve done earlier.

7

= is the assignment operator. You probably meant to use a comparison operator like ==

8

I had a go at that, thinking too that it may be the =, but no dice. I’m stumped with this one. Any suggestions?

9

If you fix the form so as to label the radio buttons properly so that they can be selected by clicking on the label as well as the button then you’d be able to reference each button by its id instead of using the old form collection.

<FORM name="form" method="post">
 Question 1
    <INPUT type="radio" name="que1" id="que1a" value="1"><label for="que1a"> right</label>
    <INPUT type="radio" name="que1" id="que1b" value="0"><label for="que1b"> wrong</label><BR>
    Question 2
    <INPUT type="radio" name="que2" id="que2a" value="1"><label for="que2a"> right</label>
    <INPUT type="radio" name="que2" id="que2b" value="0"><label for="que2b"> wrong</label><BR>
    
    
  
   
 </FORM>

You would then be able to use document.getElementById to reference the values.

Also the reason why document.form.que1[0].value == 1 isn’t working is because that particular button has a value of 0 and so that statement is always false.

10

Sounds like a good idea felgall, I attempted with this method

<script type="text/javascript">
function check(){
var questions = [document.form.que1, document.form.que2, document.form.que3, document.form.que4, document.form.que5, document.form.que6, document.form.que7, document.form.que8];
//question numbers must be assigned to array 


var grp, x, y;
var acc = Array(7);
// change array number for number of questions
for(x = 0; x < 7; x++){
acc[x] = 0;

for(y = 0; y < questions.length; y++){
grp = questions[y];

if(grp[x].value == 1){
grp[x].checked = true;
acc[x] = acc[x] + 1;

			}
		}
	}

}
</script>

IT WORKS…but
I’ve assigned each question to an array. I’m sure theres a better way to do this? I’m trying to use the getElementById method but how would I use that with my existing code? Because each quiz will have different length of questions , it would be silly for me to assign them to the array each time and not to mention increase the acc array size to fit the quiz?