• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 337
  • Last Modified:

Validate multiple radio buttons

Hi, i'm new here, and i'm no JavaScript expert, so this may be a stupid question.  I need a script that can check to see if all radio buttons are checked.  Here's my code:

<HTML>

<HEAD>
<TITLE>TEST</TITLE>

<SCRIPT language = JavaScript>

<!--

if (window.focus) self.focus();

function addyes() {

   var totals=[0,0,0,0,0,0];
   var numquestions=18;
 
   for(i=0;i<numquestions;i++)
       if(eval("document.quiz.Q" + (i+1) + "[0].checked") )
           totals[i%6]++;

   for(i=0; i<6; i++)
       eval("document.quiz." + String.fromCharCode(97+i) + ".value=totals[" + i + "];");
}

//-->

</SCRIPT>

</HEAD>

<BODY>

<FORM NAME = "quiz">

<TABLE CELLSPACING = "10">

<TR>
<TD>1(A). One</TD>
<TD><INPUT TYPE = "radio"  NAME="Q1" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q1" VALUE = "no">No</TD>
</TR>

<TR>
<TD>2(B). Two</TD>
<TD><INPUT TYPE = "radio"  NAME="Q2" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q2" VALUE = "no">No</TD>
</TR>

<TR>
<TD>3(C). Three</TD>
<TD><INPUT TYPE = "radio"  NAME="Q3" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q3" VALUE = "no">No</TD>
</TR>

<TR>
<TD>4(D). Four</TD>
<TD><INPUT TYPE = "radio"  NAME="Q4" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q4" VALUE = "no">No</TD>
</TR>

<TR>
<TD>5(E). Five</TD>
<TD><INPUT TYPE = "radio"  NAME="Q5" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q5" VALUE = "no">No</TD>
</TR>

<TR>
<TD>6(F). Six</TD>
<TD><INPUT TYPE = "radio"  NAME="Q6" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q6" VALUE = "no">No</TD>
</TR>

<TR>
<TD>7(A). Seven</TD>
<TD><INPUT TYPE = "radio"  NAME="Q7" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q7" VALUE = "no">No</TD>
</TR>

<TR>
<TD>8(B). Eight</TD>
<TD><INPUT TYPE = "radio"  NAME="Q8" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q8" VALUE = "no">No</TD>
</TR>

<TR>
<TD>9(C). Nine</TD>
<TD><INPUT TYPE = "radio"  NAME="Q9" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q9" VALUE = "no">No</TD>
</TR>

<TR>
<TD>10(D). Ten</TD>
<TD><INPUT TYPE = "radio"  NAME="Q10" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q10" VALUE = "no">No</TD>
</TR>

<TR>
<TD>11(E). Eleven</TD>
<TD><INPUT TYPE = "radio"  NAME="Q11" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q11" VALUE = "no">No</TD>
</TR>

<TR>
<TD>12(F). Twelve</TD>
<TD><INPUT TYPE = "radio"  NAME="Q12" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q12" VALUE = "no">No</TD>
</TR>

<TR>
<TD>13(A). Thirteen</TD>
<TD><INPUT TYPE = "radio"  NAME="Q13" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q13" VALUE = "no">No</TD>
</TR>

<TR>
<TD>14(B). Fourteen</TD>
<TD><INPUT TYPE = "radio"  NAME="Q14" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q14" VALUE = "no">No</TD>
</TR>

<TR>
<TD>15(C). Fifteen</TD>
<TD><INPUT TYPE = "radio"  NAME="Q15" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q15" VALUE = "no">No</TD>
</TR>

<TR>
<TD>16(D). Sixteen</TD>
<TD><INPUT TYPE = "radio"  NAME="Q16" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q16" VALUE = "no">No</TD>
</TR>

<TR>
<TD>17(E). Seventeen</TD>
<TD><INPUT TYPE = "radio"  NAME="Q17" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q17" VALUE = "no">No</TD>
</TR>

<TR>
<TD>18(F). Eighteen</TD>
<TD><INPUT TYPE = "radio"  NAME="Q18" VALUE = "yes">Yes
<INPUT TYPE = "radio" NAME="Q18" VALUE = "no">No</TD>
</TR>


</TABLE>

<INPUT onclick = "addyes()" TYPE = button VALUE = "Calculate">
<INPUT TYPE = reset VALUE = "Clear"></B>

<P>

Sum of YES A = <INPUT SIZE = "3" NAME = "a" VALUE=0>
<P>
Sum of YES B = <INPUT SIZE = "3" NAME = "b" VALUE=0>
<P>
Sum of YES C = <INPUT SIZE = "3" NAME = "c" VALUE=0>
<P>
Sum of YES D = <INPUT SIZE = "3" NAME = "d" VALUE=0>
<P>
Sum of YES E = <INPUT SIZE = "3" NAME = "e" VALUE=0>
<P>
Sum of YES F = <INPUT SIZE = "3" NAME = "f" VALUE=0>
</FORM>

</BODY>

</HTML>

Any help would be appreciated!

Ashley Power
0
ashleypower
Asked:
ashleypower
  • 5
  • 4
1 Solution
 
gator4lifeCommented:
Here you go:

function AllRadiosChecked() {

     var iNumQuestions = 18;

     for (var i = 1; i <= iNumQuestions; i++) {

          var bOneChecked = false;
          var aRadios = document.getElementsByName('Q' + i);

          for (var j = 0; j < aRadios.length; j++) {

               if (aRadios[j].checked) bOneChecked = true;
          }

          if (!bOneChecked) return false;
     }

     return true;
}

This function will return false if at least one group of radio buttons is left unchecked, and it will return true if one radio button in all groups are checked.

gator4life
(chomp, chomp)
0
 
ashleypowerAuthor Commented:
Thanks alot.  I edited your code a little and modified:

function check() {

    var iNumQuestions = 18;

    for (var i = 1; i <= iNumQuestions; i++) {

         var bOneChecked = false;
         var aRadios = document.getElementsByName('Q' + i);

         for (var j = 0; j < aRadios.length; j++) {

              if (aRadios[j].checked) bOneChecked = true;
             }

         if (!bOneChecked) alert("Not all answered!");
    }

    return true;
}

I put in the alert, but I only need ONE alert, if ALL are not anwered.  The way it is now, an alert pops up for EVERY question that isn't answered.  HELP!!!  Haha.
0
 
gator4lifeCommented:
How are you calling this function?  Since the original function only returns false or true once, you need to receive this value from where you call this function, and throw the alert if it is false, such as:

if (!AllRadiosChecked()) alert('Not all answered!');

gator4life
(chomp, chomp)
0
Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

 
ashleypowerAuthor Commented:
I'm sorry if i'm unclear, but i'm new to this JavaScript.  Ok, what i'm looking for is before the user could submit (click on "Calculate" button) an alert pops up if all the questions are not answered.  Is this what you mean?  I am new to this, but could onBlur be used here?
0
 
gator4lifeCommented:
OK, I understand your situation better now.

Change your Calculate button from:

<INPUT onclick = "addyes()" TYPE = button VALUE = "Calculate">

To this:

<input type="button" value="Calculate" onClick="JavaScript: if (!check()) alert('Not all answered!'); else addyes();">

This assumes that the function check() is this:

function check() {

    var iNumQuestions = 18;

    for (var i = 1; i <= iNumQuestions; i++) {

         var bOneChecked = false;
         var aRadios = document.getElementsByName('Q' + i);

         for (var j = 0; j < aRadios.length; j++) {

              if (aRadios[j].checked) bOneChecked = true;
         }

         if (!bOneChecked) return false;
    }

    return true;
}

Try it out and tell me if that is what you want...

gator4life
(chomp, chomp)
0
 
ashleypowerAuthor Commented:
HAHA!  Dude, that's perfect!  Your a genius!  Thanks alot, I really appreciate it.  If I can help you in any way, let me know.  I know HTML pretty well, Photoshop, Flash, Director, if I can help, let me know!

Ashley
0
 
ashleypowerAuthor Commented:
One more question...how do the point system work here?  How do I give you points?  You deserve them!
0
 
gator4lifeCommented:
I think there is a link in the gray area at the top-left of the page that will let you accept an answer.  I am not sure though, since I have never asked a question here; I just answer them! : )  Thanks a lot for the complements, and it was my pleasure to help out.  I may take you up on your Flash offer in the future...

gator4life
(chomp, chomp)
0
 
ashleypowerAuthor Commented:
Really EXCELLENT.  EXACTLY what I was looking for!
0

Featured Post

Get expert help—faster!

Need expert help—fast? Use the Help Bell for personalized assistance getting answers to your important questions.

  • 5
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now