Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Conditional validation of text box 1

Status
Not open for further replies.

JonHeath

Technical User
Feb 23, 2004
14
GB
Hi all,

I am not a javascript expert. However I have managed to get the following code working. As you can see there are two radio buttons. None are selected by default. Clicking next without selecting one will bring up the prompt saying "You have not selected an option".

If you select the bottom radio button the text box below is then enabled. However I want to check there is something in this text box when the form is submitted BUT only if the second radio button is selected. I am lost where to start. Please can anyone advise..

<HTML>
<head>
<title>Questionnaire</title>
<META HTTP-EQUIV="Expires" CONTENT="Fri, Jun 12 1981 08:20:00 GMT">
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache">
<script language="JavaScript">
<!--
function validateradio(objForm){
var err='';
var objFocus='';
if(objForm.Q1aradio[0].checked){
if(!objFocus){
objFocus=objForm.Q1aradio[1];
}
err+='You have not selected an option.';
}



if(err){
alert(err);
objFocus.focus();
}
return !err;
}
//-->
</script>
</head>

<p align="center"><u><b><font face="Verdana" size="5">Questionnaire</font></b></u></p>
<FORM NAME="MyForm" ACTION="q1b.asp"
METHOD="POST" onSubmit="return validateradio(this)">
<input name="Q1aradio" type="radio" value="" style="visibility:hidden" checked>
<%


Response.write "<p><font face='Verdana' size='2'>Question text..."

Response.write "<p><font face='Verdana' size='2'><b><input type='radio' name='Q1aradio' value='Unaware' onclick='javascript:document.MyForm.q1atext.disabled=true'>Unaware of</b></font></p>"
Response.write "<p><font face='Verdana' size='2'><b><input type='radio' name='Q1aradio' value='Aware' onclick='javascript:document.MyForm.q1atext.disabled=false'>Not useful</b> (please specify why in the text box below)</font></p>"

Response.write "<p><textarea rows='5' name='q1atext' cols='53' disabled></textarea></p>"

%>

<input type='submit' value='NEXT' >

</p>

</form>

</BODY>
</HTML>
 
Hey Jon,

Add this to you Javascript function:
Code:
<script language="JavaScript">
<!--
function validateradio(objForm){
	
     var err='';
     var objFocus='';
	 
     if(objForm.Q1aradio[0].checked){
          if(!objFocus){
               objFocus=objForm.Q1aradio[1];
          }
          err+='You have not selected an option.';
     }
     
[b]
	if(objForm.Q1aradio[1].checked){
		if(objForm.q1atext.value==''){
			alert("Please enter the reason in the Area box.");
          	objForm.q1atext.focus();
			return false;
		}
	}
[/b]

     if(err){
          alert(err);
          objFocus.focus();
     }
   return !err;
}
//-->
</script>

And name your hidden filed something else beacuse you already name your radio button Q1aradio


<input name="Q1aradio" type="radio" value="" style="visibility:hidden" checked>
 
If you must name that hidden radio button "Q1aradio", you need to increase the index of the other two to 1 & 2. The index of the three are 0,1,2. Prefer to the right index when you want to validate.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top