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

validation on radio button

Hi, I'm newbie in this area.
I have the following code :
I need some validation to all the radio button have to be checked before i post the form.
so If there is one or more radio button hasn't been checked then, the form won't be post.
I thougth, I can do it all with Java Script.

<form name="a" method="post" action="survey.asp">
<TABLE>  
  <TR>
    <TD>
      1. abcde abcde abcde abcde abcde abcde<br>
      <INPUT name=q1 type=radio value="">abc<br>
      <INPUT name=q1 type=radio value="">xyz<br>
      <INPUT name=q1 type=radio value="">pqr<br>
        <INPUT name=q1 type=radio value="">123
      </TD>
  </TR>
    <TR>
    <TD>
      2. abcde abcde abcde abcde abcde abcde<br>
      <INPUT name=q2 type=radio value="">abc<br>
      <INPUT name=q2 type=radio value="">xyz<br>
      <INPUT name=q2 type=radio value="">pqr<br>
        <INPUT name=q2 type=radio value="">123
      </TD>
  </TR>
    <TR>
    <TD>
      3. abcde abcde abcde abcde abcde abcde<br>
      <INPUT name=q3 type=radio value="">abc<br>
      <INPUT name=q3 type=radio value="">xyz<br>
      <INPUT name=q3 type=radio value="">pqr<br>
        <INPUT name=q3 type=radio value="">123
      </TD>
  </TR>
    <TR>
    <TD>
      4. abcde abcde abcde abcde abcde abcde<br>
      <INPUT name=q4 type=radio value="">abc<br>
      <INPUT name=q4 type=radio value="">xyz<br>
      <INPUT name=q4 type=radio value="">pqr<br>
        <INPUT name=q4 type=radio value="">123
      </TD>
  </TR>
    <TR>
    <TD>
      5. abcde abcde abcde abcde abcde abcde<br>
      <INPUT name=q5 type=radio value="">abc<br>
      <INPUT name=q5 type=radio value="">xyz<br>
      <INPUT name=q5 type=radio value="">pqr<br>
        <INPUT name=q5 type=radio value="">123
      </TD>
  </TR>
    <TR>
    <TD>
      6. abcde abcde abcde abcde abcde abcde<br>
      <INPUT name=q6 type=radio value="">abc<br>
      <INPUT name=q6 type=radio value="">xyz<br>
      <INPUT name=q6 type=radio value="">pqr<br>
        <INPUT name=q6 type=radio value="">123
      </TD>
  </TR>
    <TR>
    <TD>
      7. abcde abcde abcde abcde abcde abcde<br>
      <INPUT name=q7 type=radio value="">abc<br>
      <INPUT name=q7 type=radio value="">xyz<br>
      <INPUT name=q7 type=radio value="">pqr<br>
        <INPUT name=q7 type=radio value="">123
      </TD>
  </TR>
    <TR>
    <TD>
      8. abcde abcde abcde abcde abcde abcde<br>
      <INPUT name=q8 type=radio value="">abc<br>
      <INPUT name=q8 type=radio value="">xyz<br>
      <INPUT name=q8 type=radio value="">pqr<br>
        <INPUT name=q8 type=radio value="">123
      </TD>
  </TR>
  <TR>
    <TD>
      9. abcde abcde abcde abcde abcde abcde<br>
      <INPUT name=q9 type=radio value="">abc<br>
      <INPUT name=q9 type=radio value="">xyz<br>
      <INPUT name=q9 type=radio value="">pqr<br>
        <INPUT name=q9 type=radio value="">123
      </TD>
  </TR>
      <TR>
    <TD>
      10. abcde abcde abcde abcde abcde abcde<br>
      <INPUT name=q10 type=radio value="">abc<br>
      <INPUT name=q10 type=radio value="">xyz<br>
      <INPUT name=q10 type=radio value="">pqr<br>
        <INPUT name=q10 type=radio value="">123
      </TD>
  </TR>
</TABLE>
<p>No.KTP : &nbsp;<input type="text" value="" name="id" size="20"></p>
<input type="Submit" value="Submit"><input type="reset" value="Cancel">
</form>


  JavaBoy
0
JavaBoy060299
Asked:
JavaBoy060299
  • 3
  • 3
1 Solution
 
indu_maCommented:
I assume that i have two radio buttons under each group of radio button since u have for choice for each radio group use the condidtion for the for..loop as i<4

To get the checked value for the radio buttons under one group we have to use the index of it
Hope this gives u the answer


<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">


<SCRIPT ID=clientEventHandlersJS LANGUAGE=javascript>
<!--
function radio1_onclick() {
for(i=0;i<2;i++)
{
if (a.radio1[i].checked)
 return true
 }
 return false
}

function radio2_onclick() {
for(i=0;i<2;i++)
{
 if (a.radio2[i].checked)
   return true;
}
 return false  
}

function submit1_onclick() {
if (radio1_onclick() && radio2_onclick())
  a.submit()
 else
  alert("false")
   
}

//-->
</SCRIPT>
</HEAD>
<BODY>
<form name="a" action="Reservation.asp" method=post  >
<INPUT type="radio" id=radio1 name=radio1 value="" >abc
<INPUT type="radio" id=radio1 name=radio1 value="">efg
<INPUT type="radio" id=radio2 name=radio2 value="" >123
<INPUT type="radio" id=radio2 name=radio2 value="">234
<INPUT type="button" value="Submit" id=submit1 name=submit1 LANGUAGE=javascript onclick="return submit1_onclick()">
</form>
</BODY>
</HTML>

0
 
JavaBoy060299Author Commented:
Hi indu_ma,

So, I have to create 10 function, if I have 10 radio groups ?
what about if I have more than 10 groups ?
Is there any other better solution ?

0
 
bark10Commented:
I think this is more of what you are looking for.  This script checks for checked boxes in 10 questions.  (To change the number of questions checked, change:
for (var i=1; i<11; i++)  to
for (var i=1; i< (#questions+1) ; i++)
)

The script:

<script language="javascript">
function ckradio()
{
      ok=0;
      for (var i=1; i<11; i++)
            {
            for (var j=0; j<eval("a.q"+i+".length"); j++)
                  if (eval("a.q"+i+"[j].checked"))
                        {
                        ok=1;
                        break
                        }
            if (ok==0)
                  {
                  alert("Please make selection for Q"+i)
                  return false;
                  }
            else
                  ok=0;
            }
return true;
}

function validate()
{
      if (ckradio())
            a.submit()
}
            
</script>



The calling button:

<input type="button" value="Submit" onClick="return validate()">


PS.  for this to work, radio buttons must be numbered as q#, if you have a different form, I could change the script for you.
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
indu_maCommented:
indu_ma changed the proposed answer to a comment
0
 
indu_maCommented:
Iterate through each element check whether it a radio button and then check whether any one choice is checked
I have assumed that i have two questions
<HTML>
<HEAD>
<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">


<SCRIPT ID=clientEventHandlersJS LANGUAGE=javascript>
<!--
function submit1_onclick() {
var f,c
f=0  
for (i=0;i<a.elements.length;i+=4)
{
if (a.elements[i].type=="radio")
{
if ((a.elements[i].checked)|| (a.elements[i+1].checked)|| (a.elements[i+2].checked) || (a.elements[i+3].checked))
  f++;
 else
 {
    c=f+1;
   alert("Question No " + c +" Not Answered")    
 }
}
}
 
 if (f==2)  //2 implies that we  
 a.submit();  have two questions

//-->
</SCRIPT>
</HEAD>
<BODY>
<form name="a" action="Reservation.asp" method=post>
Question No:1
<INPUT type="radio" id=radio1 name=radio1 value="1" >abc
<INPUT type="radio" id=radio1 name=radio1 value="1">efg
<INPUT type="radio" id=radio1 name=radio1 value="1">pqr
<INPUT type="radio" id=radio1 name=radio1 value="1">del
<br>
Question No:2
<INPUT type="radio" id=radio2 name=radio2 value="2" >123
<INPUT type="radio" id=radio2 name=radio2 value="2">234
<INPUT type="radio" id=radio2 name=radio2 value="2">567
<INPUT type="radio" id=radio2 name=radio2 value="2">789
<INPUT type="button" value="Submit" id=submit1 name=submit1 LANGUAGE=javascript onclick="return submit1_onclick()">
</form>
</BODY>
</HTML>
0
 
bark10Commented:
Kind of what I proposed, huh indu_ma?
0
 
bark10Commented:
You should be able to paste mine directly into your page.
0

Featured Post

Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

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