I'm trying to create a Quiz for a Spanish class. I have little experience with JavaScript, but am fairly proficient with html and CSS. I have a question and followed by three radio buttons with answers. There are two incorrect answers and a correct answer. I have 45 questions total.

<form name="quiz" method="post" name="buttons" id="form" onsubmit="return totalVal()">

<li><div class="question">¿Quién detestan la nueva casa?</div></li>
<input id="answer" type="radio" name="group1" value="wrong"> Josh<br>
<input id="answer" type="radio" name="group1" value="wrong"> Amanda<br>
<input id="answer" type="radio" name="group1" value="correct"> Josh y Amanda<hr>

<li><div class="question">¿Quién es señor Dawes?</div></li>
<input id="answer" type="radio" name="group2" value="wrong">Un familia amigo<br>
<input id="answer" type="radio" name="group2" value="wrong">Un gato<br>
<input id="answer" type="radio" name="group2" value="correct">Un amable joven de la agencia de bienes raíces<hr>

<li><div class="question">¿Quién qué sus buscan?</div></li>
<input id="answer" type="radio" name="group3" value="wrong">Josh<br>
<input id="answer" type="radio" name="group3" value="wrong"> Petey<br>
<input id="answer" type="radio" name="group3" value="correct" >Josh y Petey<hr>

<button class="submit" onclick="showTotalvalue();" type="submit">Submit</button></div>

I want to use some basic Javascript to count all the "correct" radio button values and output to a new page or alert box that displays after the user clicks submit.

I found this in my research. In my googling, I haven't been able to find a snippet of code that counts the "correct" values. The link above is the closest I've gotten. I attached the JavaScript that I changed to fit my situation from the suggestion on the other post.

totalVal = 0;

// calculate the total number of corrects clicked

for (y = 0; y = incorrectOfQuestion; y++) {
    var questionNo = document.getElementsByName("questions" + y);
    for (i = 0; i < questionNo.length; i++) {
        if (document.myform.questions[i].checked == true) {
            totalVal = totalVal + parseInt(document.myform.questions[i].value, 45);
        }
    }
}

Any assistance is greatly appreciated as I am in a time crunch! Thank you!

I'm trying to create a Quiz for a Spanish class. I have little experience with JavaScript, but am fairly proficient with html and CSS. I have a question and followed by three radio buttons with answers. There are two incorrect answers and a correct answer. I have 45 questions total.

<form name="quiz" method="post" name="buttons" id="form" onsubmit="return totalVal()">

<li><div class="question">¿Quién detestan la nueva casa?</div></li>
<input id="answer" type="radio" name="group1" value="wrong"> Josh<br>
<input id="answer" type="radio" name="group1" value="wrong"> Amanda<br>
<input id="answer" type="radio" name="group1" value="correct"> Josh y Amanda<hr>

<li><div class="question">¿Quién es señor Dawes?</div></li>
<input id="answer" type="radio" name="group2" value="wrong">Un familia amigo<br>
<input id="answer" type="radio" name="group2" value="wrong">Un gato<br>
<input id="answer" type="radio" name="group2" value="correct">Un amable joven de la agencia de bienes raíces<hr>

<li><div class="question">¿Quién qué sus buscan?</div></li>
<input id="answer" type="radio" name="group3" value="wrong">Josh<br>
<input id="answer" type="radio" name="group3" value="wrong"> Petey<br>
<input id="answer" type="radio" name="group3" value="correct" >Josh y Petey<hr>

<button class="submit" onclick="showTotalvalue();" type="submit">Submit</button></div>

I want to use some basic Javascript to count all the "correct" radio button values and output to a new page or alert box that displays after the user clicks submit.

I found this in my research. In my googling, I haven't been able to find a snippet of code that counts the "correct" values. The link above is the closest I've gotten. I attached the JavaScript that I changed to fit my situation from the suggestion on the other post.

totalVal = 0;

// calculate the total number of corrects clicked

for (y = 0; y = incorrectOfQuestion; y++) {
    var questionNo = document.getElementsByName("questions" + y);
    for (i = 0; i < questionNo.length; i++) {
        if (document.myform.questions[i].checked == true) {
            totalVal = totalVal + parseInt(document.myform.questions[i].value, 45);
        }
    }
}

Any assistance is greatly appreciated as I am in a time crunch! Thank you!

• javascript
• html
• count
• radio-button

• What is parseInt(..., 45) supposed to do? You're calculating in base 45, but I don't see why you would want that. – pimvdb Commented Dec 18, 2012 at 15:14
• this task would be made much simplier if you used JQuery, jquery. – Liam Commented Dec 18, 2012 at 15:14
• @pimvdb - my guess is that the OP thought that the radix parameter was related the the number of questions. – j08691 Commented Dec 18, 2012 at 15:15
• @pimvdb It thought that was total number of questions from the link above. – technogeek1995 Commented Dec 18, 2012 at 15:17

2 Answers 2

This should be the code you require to get it working with an alert box:

        function handleClick()
          {         
        var amountCorrect = 0;          
        for(var i = 1; i <= 45; i++) {
          var radios = document.getElementsByName('group'+i);
          for(var j = 0; j < radios.length; j++) {
            var radio = radios[j];
            if(radio.value == "correct" && radio.checked) {
              amountCorrect++;
            }
          }
         }                   
            alert("Correct Responses: " + amountCorrect);
          }

        <form name="quiz" method="post" name="buttons" id="quiz" onsubmit="return false">

        <li><div class="question">¿Quién detestan la nueva casa?</div></li>
        <input id="answer" type="radio" name="group1" value="wrong"> Josh<br>
        <input id="answer" type="radio" name="group1" value="wrong"> Amanda<br>
        <input id="answer" type="radio" name="group1" value="correct"> Josh y Amanda<hr>

        <li><div class="question">¿Quién es señor Dawes?</div></li>
        <input id="answer" type="radio" name="group2" value="wrong">Un familia amigo<br>
        <input id="answer" type="radio" name="group2" value="wrong">Un gato<br>
        <input id="answer" type="radio" name="group2" value="correct">Un amable joven de la agencia de bienes raíces<hr>

        <li><div class="question">¿Quién qué sus buscan?</div></li>
        <input id="answer" type="radio" name="group3" value="wrong">Josh<br>
        <input id="answer" type="radio" name="group3" value="wrong"> Petey<br>
        <input id="answer" type="radio" name="group3" value="correct" >Josh y Petey<hr>

        <button class="submit" onclick="return handleClick();" type="submit">Submit</button>
        
        </form>

@pimvdb had used the === operator when checking for the "correct" string which does not allow type conversion and was therefore failing. He also used getElementsByClassName but the elements do not have a class applied to them so this was incorrect.

The working version can be found in the fiddle below. As you can see the onsubmit of the form has been set to "return false" to stop the form from posting.

http://jsfiddle/g45nG/1/

You can loop over each radio group, then loop over each radio button to check whether the correct one is checked.

var amountCorrect = 0;
for(var i = 1; i <= 45; i++) {
  var radios = document.getElementsByName("group" + i);
  for(var j = 0; j < radios.length; j++) {
    var radio = radios[j];
    if(radio.value === "correct" && radio.checked) {
      amountCorrect++;
    }
  }
}