JavaScript - Multiple Field Validation Help Needed Js

Below is some code I wrote for my assignment that is due tonight; however, I can't seem to get any of the validation features to work. Can someone help me? I'm really new to javascript and struggling through it, but really want to figure this out.

Here are the things I'm trying to do:
-Validate each textbox to make sure they aren't empty
-Validate one textbox to make sure that the text entered is numeric only
-Validate the two email addresses for proper email format
-Validate the two email addresses to make sure they are exactly alike
-Show all of your errors at once, in one alert box, not individually.
-Only check for matching emails if the first is valid.


Here is my attempt at the code:
[CODE]
<script type="text/javascript">


<!-- Hide from older browsers

var ProductInquiryForm;

function Validate( ProductInquiryForm )
{
formName = ProductInquiryForm;
}

function ValidEmail( EmailSearch )
{
var txtEmail = EmailSearch.value;
var intAtSign = txtEmail.indexOf("@");
var intLastDot = txtEmail.lastIndexOf(".");
if( txtEmail == "" || txtEmail == null )
{
return false;
}
if( intAtSign == -1 || intLastDot == -1 )
{
return false;
}
if( intLastDot < intAtSign )
{
return false;
}
if( intLastDot - intAtSign == 1 )
{
return false;
}
if( intLastDot >= txtEmail.length-2 )
{
return false;
}
else
{
return true;
}
}

function ValidEmail( ConfirmEmailSearch )
{
var txtEmail = ConfirmEmailSearch.value;
var intAtSign = txtEmail.indexOf("@");
var intLastDot = txtEmail.lastIndexOf(".");
if( txtEmail == "" || txtEmail == null )
{
return false;
}
if( intAtSign == -1 || intLastDot == -1 )
{
return false;
}
if( intLastDot < intAtSign )
{
return false;
}
if( intLastDot - intAtSign == 1 )
{
return false;
}
if( intLastDot >= txtEmail.length-2 )
{
return false;
}
if (EmailSearch!= ConfirmEmailSearch)
{
return false;
}
else
{
return true;
}
}

function ApprovedEmail ( ConfirmEmailSearch )
{
if( HasText(EmailSearch) && ValidEmail(EmailSearch) && HasText(ConfirmEmailSearch) && ValidEmail(ConfirmEmailSearch))
{
return true;
}
else
{
alert("A valid email must be entered and match in both fields!");
return false;
}
}

function validateZIP(ZIPSearch)
{
if( ZIPSearch.value != 0||1||2||3||4||5||6||7||8||9)
{
alert("Please enter digits only for the ZIP code.");
return false;
}
if (field.length!=5)
{
alert("Please enter no more than 5 digits for your ZIP code.");
return false;
}

function HasText( ProductSearchDescription )
{
if( ProductSearchDescription.value.length != 0 )
{
return true;
}
else
{
alert("Please enter your product needs.");
return false;
}
}

// Stop hiding -->
</script>

<noscript>
This site uses JavaScript code for validation and calculations based on user input.
</noscript>

<form name="form1" id="form1" method="post" action="intercept-searchform.asp" onsubmit="return Validate(this)">

<div>
<label for="EmailSearch">Email Address:</label>
<input name="EmailSearch" type="text" class="TextBox" id="EmailSearch" />
</div>

<div>
<label for="ConfirmEmailSearch">Confirm Email Address:</label>
<input name="ConfirmEmailSearch" type="text" class="TextBox" id="ConfirmEmailSearch" />
</div>

<div>
<label for="ZIPSearch">ZIP Code</label>
<input name="ZIPSearch" type="zip" class="zip" id="zip" />
</div>

<div>
<label for="ProductSearchDescription">Describe the product you are looking for.</label>
<textarea name="ProductSearchDescription" id="ProductSearchDescription" class= "Comments" rows="6" cols="50"></textarea>
</div>

<br />

<div id="buttons">
<input name="Submit" type="Submit" value="Submit" />
<input name="Reset" type="Reset" />
</div>
</form>

[CODE]

Thank you so much to anyone willing to help give me some guidance!

Hello, I have a three field contact form on an HTML5 page. Using CSS3/HTML5 techniques, the fields change state as the info is entered properly (green OK symbol if good, red "!" if not, etc). That all works as expected in all browsers.

My final hurdle is preventing the form being submitted with nothing entered in the fields. I have done hours of research and have tried several ways of writing the checkFeedbackForm function. My problem is that none of the solutions I've found are recognized by FireFox (mac and pc) and IE. They just ignore the javascript and allow the empty form to be emailed.

Here is the code that is checking the fields:

Code:

<script type="text/javascript">
function checkFeedbackForm(form){
	if(form.fullname.value=='') {
		alert('Please enter your Name');
		form.fullname.focus();
		return false;
		}
if(form.email.value=='') {
	alert('Please enter a valid Email address');
	form.email.focus();
	return false;
	}
if(form.message.value=='') {
	alert('Please tell me a little bit about your ideas.');
	form.message.focus();
	return false;
	}
return true;
}
</script>

Here is my form:
Code:

<form id="signup" action="mailinfo.php" method="post" onSubmit="return checkFeedbackForm(this);" >
<input type="hidden" name="returnURL" value="thankyou.html" />
<fieldset><ol>

<li><label for="fullname">Name</label> 
<input type="text" id="fullname" name="fullname" placeholder="Your name" required /></li>

<li><label for="email">Email</label> 
<input type="email" id="email" name="email" placeholder="Your email" title="Please enter a valid email" required /></li>

<li><label for="message">Message</label> 
<textarea id="message" name="message" cols="32" rows="8"  placeholder="Your message" required /></textarea></li></ol>
</fieldset>

<input type="submit" value="Send It" />
<div class="privacy">Your information is for our project only and will not be shared or sold. Promise.</div>
</form>

Through experimentation, I have found that removing the ID from the form allows the javascript to function in all browsers, but that kills my form styling. I think it will be easier to fix the javascript than redo my CSS.

This may be obvious, but I'm not a programmer. I'm a designer who muddles through on small scale stuff like this. Any help is greatly appreciated.

Thanks.

Hi,

I want to pop up message incase of validation failure of form field.

If I use document.write("name shold be between 2 to 15 char only")

it redirects to new page and gives this message..........

if I use alert than incase or 2 or more validation fail it gives multiple or one by one alert boxes.

I want to to displey my message near to field............... Code:

function validateForm()
{
var x=document.forms["regform"]["email_id"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");


if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
  {
  alert("Not a valid e-mail address");
  return false;
  }
}

I have a phone number field on my form that needs validation, but I'm not sure how to code this. I have the following function to validate a first name is entered and last name. The phone number field must match a 7 digit or 10 digit(with area code)phone number. I want to be able to include paranthese and/or hyphens for the valid phone number.

function checkForm1() {
if (document.forms[0].firstname.value.length == 0) {
alert("You must put in a first name");
return false;
}
else if (document.forms[0].lastname.value.length == 0) {
alert("You must put in a last name");
return false;
}

Hello Everyone,

I need to add some sort of validation that will only allow users to upload .jpg files. I really need to add this to an existing script I've already written. I've seen scripts and tutorials that add the jpg validation but only incorporate the image field of the form. I need the script to validate several forms in the field, not just one. When I try to add validation for the jpg field to the follow script everything stops working. Can someone please point me in the right direction? Thanks!

Code:

<form id="uploadForm" method=post class="upload" action=submit_script.php enctype='multipart/form-data' onsubmit="return validate_form(this)">
		<p><b>First Name</b><br/>
		<INPUT TYPE="TEXT" NAME="name_first" size="40"></p>

		<p><b>Last Name</b><br/>
		<INPUT TYPE="TEXT" NAME="name_last" size="40"></p>

		<p><b>School Name</b><br/>
		<INPUT TYPE="TEXT" NAME="name_school" size="40"></p>

		<p><b>Your School E-Mail</b><font class="super">1</font><br/>
		<INPUT TYPE="TEXT" NAME="school_email" size="40"></p>

		<p><b>Your File</b><font class="super">4,5</font><br/>
		<input id="userfile1" name="userfile1" type="file" size="30"></p>
	
		<p><input name="upload" type="submit" class="box" id="upload" value="Submit Your Poster" onClick="YAHOO.example.container.wait.show();"></p>
	</form>

Code:

function validate_required_field(field,alertText) {
	with (field) {
		if (value==null||value=="") {
            YAHOO.example.container.wait.hide();
			alert(alertText);
	  		return false;
		}
		else {
			return true;
		}
	}
}


function validate_email(field,alertText)
{
	with (field) {
		apos=value.indexOf("@");
		dotpos=value.lastIndexOf(".");
		if (apos<1||dotpos-apos<2) {
            YAHOO.example.container.wait.hide();
			alert(alertText);
			return false;
		}
		else {
			return true;
		}
	}
}


function validate_form(thisform) {
	with (thisform) {
		if (validate_required_field(name_first,"Please enter a value in the 'First Name' field before continuing")==false) {
			name_first.focus();
			return false
		}
	}
	with (thisform) {
		if (validate_required_field(name_last,"Please enter a value in the 'Last Name' field before continuing")==false) {
			name_last.focus();
			return false
		}
	}
	with (thisform) {
		if (validate_required_field(name_school,"Please enter a value in the 'School Name' field before continuing")==false) {
			name_school.focus();
			return false
		}
	}
	with (thisform) {
		if (validate_required_field(school_email,"Please enter a value in the 'School Email' field before continuing")==false) {
			school_email.focus();
			return false
		}
	}
	with (thisform) {
		if (validate_email(school_email,"Please enter a valid email address before continuing")==false) {
			school_email.focus();
			return false
		}
	}
}

Hi Guys,

Im in need of some help with regards to forms. I am looking to build as basic as possible, a form that has 3 select dropdowns that have predetermined options. The user will select the first option and based on that option the second will populate and based on that, the third one will give the last option.

Now, when the last one is selected, i need a div or a paragraph displaying information to be displayed.

So here's the framework.

Option 1 = fruit or vegitables of which fruit is selected is selected by the user
Option 2 = Apples, Grapes, and pears of which apples is then selected
Option 3 = Red, Green and Yellow of which Green is selected.

Once green is selected, I need a description about the green aple to be displayed.

Can anyone help me out on this? I am not sure where to begin and my boss is adament it must be done like yesterday. Ay help will be appreciated.

Thanks.

I am Gururaj.
I have written a form in HTML which contains username,lastname,email,password and submit.
I have written a javascript to validate this form [validate(username,lastname,email,password)].
On submit this javascript function will be called and hence form get validated.
I am passing all the arguements(username,lastname,email and password) to the javascript function..


Is it possible to make me a code such that it should call an individual function for each field in the form.for ex:if i have not entered username, last name in the form and attempt to submit, only username arguement should be passed to the function as it comes first in the form.
In other sense i want to validate individual text field validation of my form.


So can anybody help me.It will be very needful to me.

I am finishing up my Form page, and totally forgot to have a numeric only field. So I added it and I can't get it to work. I also am having issues throwing an error when you don't select at least one topping.

And are these lines correct?
Code:

document.cookie = "toppings=" + encodeURIComponent(document.getElementsByName("toppings[]").value);

Code:

document.cookie = "extra=" + encodeURIComponent(extra);

Here is a link to the page hosted on my dropbox

http://dl.dropbox.com/u/49211616/dw/...orderPage.html

Javascript:
Code:

function validateOrder ()
{
	var crustSelection = document.orderForm.crust.value; 
	var crustPrice; //Adds $1 for Deep DishParmesagn, and Sourdough 
	var count = 0; //Amount of Toppings Selected
	var choice = ""; //Toppings Selected list
	var x = ""; //Don't need for the Cookie
	var extra = 0; //extra charge for toppings over 3
	try{
		  
        var error = ""; // Initialize Var to store the error messages.
        

	if(document.getElementById("delivery").checked != true &&
           document.getElementById("takeout").checked != true)
	{
           error=error+"Order Type is required.\n"
                }
	if(document.getElementById("fname").value == "")  
	{
        error = error + "First Name is required.\n";
        	}
        if(document.getElementById("lname").value == "") 
	{
        error = error + "Last Name is required.\n";
        	}
        if(document.getElementById("address").value == "") 
	{
        error = error + "Street address is required.\n";
        	}
        if (isNaN(document.getElementById("quantity")))
	{
error = error + "Enter Pizza Quantity in Numbers Only.\n";
			} 
	    if(document.getElementById("crust").value == "") 
	{
        error = error + "Crust Type is required.\n";
        	} 
		if(document.getElementsByName("toppings").value == 0) 
	{
        error = error + "Select at Least One Topping.\n";
        	} 

	if(error == "") 
	{
        // save all the information in the cookie
document.cookie = "firstName=" + encodeURIComponent(document.getElementById("fname").value);
document.cookie = "lastName=" + encodeURIComponent(document.getElementById("lname").value);
document.cookie = "address=" + encodeURIComponent(document.getElementById("address").value);
document.cookie = "order=" + encodeURIComponent((document.getElementById("delivery").checked) ? "delivery" : "takeout");
document.cookie = "quantity=" + encodeURIComponent(document.getElementById("quantity").value);
document.cookie = "quantity=" + encodeURIComponent(document.getElementById("quantity").value);
document.cookie = "crust=" + encodeURIComponent(document.getElementById("crust").value);
document.cookie = "toppings=" + encodeURIComponent(document.getElementsByName("toppings[]").value);      
alert("Order successfully Placed!");
		}
		else 
		{
             alert(error);
        }
    }
	catch(ex) 
	{
        alert("An error occurred!.\n" + "Error Name : " + ex.name + "\nError Message : " + ex.message);
    }
	
for (var i=1; i<11; i++) 
{
x = document.orderForm['toppings' + i].value;
if (document.orderForm['toppings' + i].checked) 
{
choice = choice + "  " +  x ;
count ++;   
} 
}  
if (choice.length <= 0) 
{
choice = choice + "NONE";
}
if (count > 3)
{
	extra = (count - 3) * 1 
}
document.cookie = "extra=" + encodeURIComponent(extra);  
}
</script>

HTML:
Code:

<form name = "orderForm" onsubmit="validateOrder()">
<table width="600" border="0">
  <tr>
    <th scope="col" width="400" align="left"><b>First Name</b><br /><input type="text" id="fname" name="fname" size=30>
<br />
<br />
<b>Last Name</b><br />
<input type="text" id="lname" name="lname" size=30>
<br />
<br />
<b>Street Address</b><br />
<input type="text" id="address" name="address" size=30>
<br />
<br />
<input name="orderType" value="delivery" id="delivery" type="radio">Delivery</font>
<input name="orderType" value="takeOut" id="takeout" type="radio">Take Out</font></th>
    <th scope="col" width="200" align="Left">
    How Many Pizzas? <input type="text" id="quantity" name="quantity" size=5>
    <br />
    <br />
    <select name="crust" id="crust">
  <option selected value="false">Select Crust Type</option>
  <option value="regular">Regular Crust</option>
<option value="thin">Thin Crust</option>
  <option value="deep">Deep Dish</option>
  <option value="Parmesagn">Parmesagn Cheese</option>
  <option value="sourdough">Sourdough</option>
</select>
<br />
<br />
Select at Least One Topping:
<br />
<br />
<input name = "toppings1" type = "checkbox" value = "extraCheese"> Extra Cheese<br>
<input name = "toppings2" type = "checkbox" value = "sausage"> Sausage<br>
<input name = "toppings3" type = "checkbox" value = "pepperoni"> Pepperoni<br>
<input name = "toppings4" type = "checkbox" value = "bacon"> Bacon<br>
<input name = "toppings5" type = "checkbox" value = "canadianBacon"> Canadian Bacon<br>
<input name = "toppings6" type = "checkbox" value = "mushroom"> Mushroom<br>
<input name = "toppings7" type = "checkbox" value = "pineapple"> Pineapple<br>
<input name = "toppings8" type = "checkbox" value = "onion"> Onion<br>
<input name = "toppings9" type = "checkbox" value = "olive"> Olive<br>
<input name = "toppings10" type = "checkbox" value = "greenPepper"> Green Pepper<br></th>
  </tr>
</table>
<input name="submit" type="submit" value="submit" /><input name="" type="reset" />
</form>

here is the html code that i have

PHP Code:
<td valign="middle" valign="middle">
                                                <input type="radio" name="gender" id="genderM" value="Male" />&nbsp;Male&nbsp;&nbsp;&nbsp;&nbsp;
                                                <input  type="radio" name="gender" id="genderFM" value="Female" />&nbsp;Female
                                            </td> 


and here is the js funtion

PHP Code:
    var $j = jQuery.noConflict();
    function isValidEmail(str) {
       return (str.indexOf(".") > 2) && (str.indexOf("@") > 0);
    }
    function validateForm(){
            var firstName;
            var lastName;
            var email;
            var mobile;
            var comment;
            var error;
            
            firstName = $j('#firstName').val();
            lastName = $j('#lastName').val();
            email = $j('#email').val();
            mobile = $j('#mobile').val();
            comment = $j('#comment').val();
            if(firstName=='' || firstName.length < 3){
                error = 'Please Enter Your First Name';
                $j('#errormsg').html('<p class="errors">'+ error +'</p>');
                return false;
            }
            if(lastName=='' || lastName.length < 3){
                error = 'Please Enter Your Second Name';
                $j('#errormsg').html('<p class="errors">'+ error +'</p>');
                return false;
            }
        
            //mob
            //$jmob_pattern = '^\d{10}$j';
            if(mobile.length != 10 || isNaN(mobile)){
                error = 'Please Enter Your Mobile Number';
                $j('#errormsg').html('<p class="errors">'+ error +'</p>');
                return false;
            }
                if(email=='' || !isValidEmail(email)){
                error = 'Please Enter Your Email Address';
                $j('#errormsg').html('<p class="errors">'+ error +'</p>');
                return false;
            }
            
            if(comment.length < 5){
                error = 'Please Enter A Comment';
                $j('#errormsg').html('<p class="errors">'+ error +'</p>');
                return false;
            }
            return true;
    } 


Does anybody know how i check to see if the radio button is select and also can anybody tell me how i can check for an email in the correct format

the function isValidEmail in the above alows emails to pass through if they are in this format aaa@aaa. i only want them to go through if they are aaa@aaa.com

Thanks for your help if you give it

I'm an artist working on a project that involves 9 swfs embedded in a html page and placed in tables. Although each swf has it's own volume control and pause/play buttons on mouseover, I need an outside script
like java, that can be used to stop and start a few swf's simultaneously so that 3 or 4 play while the others are paused. There would be a few different combinations of them playing together that would be opted for by a menu choice. The swf's are in an old version of Macromedia Flash MX 6 using Action Script 2.
I have absolutely no experience writing java scripting. None. I would be glad to pay somebody to write it for me. The page is online. If interested, I can forward the link.
Thanks for your time.

Hi,

I am setting up an email form & i would like the subject field to hold multiple values, the forrm will be something like this:

Name:Mr A
Date: 01/01/01
Reason:Football

I want the form to send an email without opening an email client & I would like the subject field to look like this:

Subject: Mr A, 01/01/01, Football

or

Subject Mr A - 01/01/01 - Football

Can anyone tell me if this is possible, if if is can you please point me in the right direction.

Thanks

I am somewhat a noob at js/jquery so I wasn't sure exactly how to do this. Think I just need a push in the right direction. Basically I'm trying to validate a form (jquery validation) with a couple of conditionals based on a selection box. So I have:

Code:

<form id="info" class="validate">
                   
<select id="select">
	<option value="senior">Senior Citizen</option>
	<option value="adult">Adult</option>
	<option value="child">Child</option>
</select>
					
<input type="text" name="age" id="age" class="required" minlength="1" maxlength="3" title="age group">
					
</form>

I'm trying to validate that if the user has selected "Senior Citizen" then their age must be 65 or older (and validate the adult/child ages as well). I hope to get this all in ajax so it would be checking it live. Thanks for the help!

Hi, i'm new here and I need help.
I need a script that can alert in 2 ways for multiple radio button groups of "yes" and "no." I got the first question to alert the way I need (with alert #1 for yes and alert#2 for no.) However, starting from the 2nd question it alerts #1 for both yes and no.

This is the script I'm working with:
Code:

<script type="text/javascript">
function valbutton(form) {
myOption = -1;
for (i=form.buttonset1.length-1; i > 0; i--) {
if (form.buttonset1[i].checked) {
myOption = i; i = -1;
}
}
if (myOption == -1) {
alert("Please select Yes or No");
return false;
}
if (myOption == 1) {
alert("Yes, it works!");
return false;
}
if (myOption == 2) {
alert("No, it won't work.");
return false;
}
}
</script>

The following are the 1st two sets of radio buttons:
Code:

<form name="myform" action="formstest.html">
<tr>
<td>	<input type="reset" value="Click to Reset">
<br><input type="radio" name="buttonset1" value="1" rel="none" id="r1" /><label for="r1">Click to Start Over</label><br /></td>
</tr>
<tr><td class="question">Question #1</td>
<td><input type="radio" name="buttonset1" value="2" rel="flat" id="r2" /> <label for="r2">Yes</label><br />
<input type="radio" name="buttonset1" value="3" rel="none" id="r3" /> <label for="r3">No</label><br />
</td>
</tr>
<tr rel="flat">
<td class="question"><label for="flat"><span class="accessibility">If metal:</span>Question #2</label></td>
<td><input type="radio" name="buttonset2" value="4" rel="uneven" id="r4" /> <label for="r4">Yes</label><br />
<input type="radio" name="buttonset2" value="5" rel="none" id="r5" /> <label for="r5">No</label><br />
</td>
</tr>

Is it possible to switch out the alerts for yes and no for next 4 questions?

And finally, the following is the lengthy, thorough version of my question if it clarifies what I'm trying to do. I would really appreciate someone to point me the right direction. I've tried all kinds of variation to the script and I just can't seem to make it work. Thanks in advance!

(Lengthy Version)
I also need questions to appear (or not show) below as select radio buttons are clicked.

I have 6 groups of yes and no radio buttons.
I would like the first two groups to have "alert 1" when yes is clicked (and "alert 2" for no.) I would like the rest to show "alert 2" when yes is clicked (and "alert 1" for no.)

(I also have all the questions hidden below question 1. Each subsequent questions appear upon clicking yes for questions 1&2, and no for the rest. I would like to keep this intact - I put that js code I downloaded at the end of this post.)

Here's what I have so far... I got most of it working except after the first question, "alert 1" appears for all the clicks submitted. I've been at it for a few weeks and I can't seem to figure it out. Thanks in advance!
Code:

<html>
<head>
<title>Form Test</title>
<script type="text/javascript">
function valbutton(form) {
myOption = -1;
for (i=form.buttonset1.length-1; i > 0; i--) {
if (form.buttonset1[i].checked) {
myOption = i; i = -1;
}
}
if (myOption == -1) {
alert("Please select Yes or No");
return false;
}
if (myOption == 1) {
alert("Yes, it works!");
return false;
}
if (myOption == 2) {
alert("No, it won't work.");
return false;
}
}
</script>
</head>
<body>
<form name="myform" action="formstest.html">
<tr>
<td>	<input type="reset" value="Click to Reset">
<br><input type="radio" name="buttonset1" value="1" rel="none" id="r1" /><label for="r1">Click to Start Over</label><br /></td>
</tr>
<tr><td class="question">Question #1</td>
<td><input type="radio" name="buttonset1" value="2" rel="flat" id="r2" /> <label for="r2">Yes</label><br />
<input type="radio" name="buttonset1" value="3" rel="none" id="r3" /> <label for="r3">No</label><br />
</td>
</tr>
<tr rel="flat">
<td class="question"><label for="flat"><span class="accessibility">If metal:</span>Question #2</label></td>
<td><input type="radio" name="buttonset2" value="4" rel="uneven" id="r4" /> <label for="r4">Yes</label><br />
<input type="radio" name="buttonset2" value="5" rel="none" id="r5" /> <label for="r5">No</label><br />
</td>
</tr>
<tr rel="uneven">
<td class="question"><label for="uneven"><span class="accessibility">If flat:</span> Question #3</label></td>
<td><input type="radio" name="buttonset3" value="6" rel="none" id="r6" /> <label for="r6">Yes</label><br />
<input type="radio" name="buttonset3" value="7" rel="ridges" id="r7" /> <label for="r7">No</label><br />
</td>
</tr>
<tr rel="ridges">
<td class="question"><label for="ridges"><span class="accessibility">If uneven:</span> Question #4</label></td>
<td><input type="radio" name="buttonset4" value="8" rel="none" id="r8" /> <label for="r8">Yes</label><br />
<input type="radio" name="buttonset4" value="9" rel="holes" id="r9" /> <label for="r9">No</label><br />
</td>
</tr>
<tr rel="holes">
<td class="question"><label for="holes"><span class="accessibility">If ridges:</span> Question #5</label></td>
<td><input type="radio" name="buttonset5" value="10" rel="none" id="r10" /> <label for="r10">Yes</label><br />
<input type="radio" name="buttonset5" value="11" rel="curved" id="r11" /> <label for="r11">No</label><br />
</td>
</tr>
<tr rel="curved">
<td class="question"><label for="curved"><span class="accessibility">If holes:</span>Question #6 </label></td>
<td><input type="radio" name="buttonset6" value="12" rel="none" id="r12" /> <label for="r12">Yes</label><br />
<input type="radio" name="buttonset6" value="13" rel="answer" id="r13" /> <label for="r13">No</label><br />
</td>
</tr>
<tr rel="answer">
<td></td>
<td class="question"><label for="answer"><span class="accessibility">If not curved:</span><strong> Yes, correct answer!</strong></label></td>
</tr>
<tr>
<td colspan="2"><input type="submit" name="submitit" onclick="valbutton(myform);return false;" value="Submit" /></td>
</tr>
</tbody>
</table>
</form>
</body>
</html>

The following is the JS found to make corresponding questions appear as each relevant radio button answer is clicked:
Code:

/*****************************************/
/** Usable Forms 2.0, November 2005     **/
/** Written by ppk, www.quirksmode.org  **/
/** Instructions for use on my site     **/
/**                                     **/
/** You may use or change this script   **/
/** only when this copyright notice     **/
/** is intact.                          **/
/**                                     **/
/** If you extend the script, please    **/
/** add a short description and your    **/
/** name below.                         **/
/*****************************************/
var containerTag = 'TR';
var compatible = (
document.getElementById && document.getElementsByTagName && document.createElement
&&
!(navigator.userAgent.indexOf('MSIE 5') != -1 && navigator.userAgent.indexOf('Mac') != -1)
);
if (compatible)
{
document.write('<style>.accessibility{display: none}</style>');
var waitingRoom = document.createElement('div');
}
var hiddenFormFieldsPointers = new Object();
function prepareForm()
{
if (!compatible) return;
var marker = document.createElement(containerTag);
marker.style.display = 'none';
var x = document.getElementsByTagName('select');
for (var i=0;i<x.length;i++)
addEvent(x[i],'change',showHideFields)
var x = document.getElementsByTagName(containerTag);
var hiddenFields = new Array;
for (var i=0;i<x.length;i++)
{
if (x[i].getAttribute('rel'))
{
var y = getAllFormFields(x[i]);
x[i].nestedRels = new Array();
for (var j=0;j<y.length;j++)
{
var rel = y[j].getAttribute('rel');
if (!rel || rel == 'none') continue;
x[i].nestedRels.push(rel);
}
if (!x[i].nestedRels.length) x[i].nestedRels = null;
hiddenFields.push(x[i]);
}
}
while (hiddenFields.length)
{
var rel = hiddenFields[0].getAttribute('rel');
if (!hiddenFormFieldsPointers[rel])
hiddenFormFieldsPointers[rel] = new Array();
var relIndex = hiddenFormFieldsPointers[rel].length;
hiddenFormFieldsPointers[rel][relIndex] = hiddenFields[0];
var newMarker = marker.cloneNode(true);
newMarker.id = rel + relIndex;
hiddenFields[0].parentNode.replaceChild(newMarker,hiddenFields[0]);
waitingRoom.appendChild(hiddenFields.shift());
}
setDefaults();
addEvent(document,'click',showHideFields);
}
function setDefaults()
{
var y = document.getElementsByTagName('input');
for (var i=0;i<y.length;i++)
{
if (y[i].checked && y[i].getAttribute('rel'))
intoMainForm(y[i].getAttribute('rel'))
}
var z = document.getElementsByTagName('select');
for (var i=0;i<z.length;i++)
{
if (z[i].options[z[i].selectedIndex].getAttribute('rel'))
intoMainForm(z[i].options[z[i].selectedIndex].getAttribute('rel'))
}
}
function showHideFields(e)
{
if (!e) var e = window.event;
var tg = e.target || e.srcElement;
if (tg.nodeName == 'LABEL')
{
var relatedFieldName = tg.getAttribute('for') || tg.getAttribute('htmlFor');
tg = document.getElementById(relatedFieldName);
}
if (
!(tg.nodeName == 'SELECT' && e.type == 'change')
&&
!(tg.nodeName == 'INPUT' && tg.getAttribute('rel'))
) return;
var fieldsToBeInserted = tg.getAttribute('rel');
if (tg.type == 'radio')
{
removeOthers(tg.form[tg.name],fieldsToBeInserted)
intoMainForm(fieldsToBeInserted);
}
}
function removeOthers(others,fieldsToBeInserted)
{
for (var i=0;i<others.length;i++)
{
var show = others[i].getAttribute('rel');
if (show == fieldsToBeInserted) continue;
intoWaitingRoom(show);
}
}
function intoWaitingRoom(relation)
{
if (relation == 'none') return;
var Elements = hiddenFormFieldsPointers[relation];
for (var i=0;i<Elements.length;i++)
{
waitingRoom.appendChild(Elements[i]);
if (Elements[i].nestedRels)
for (var j=0;j<Elements[i].nestedRels.length;j++)
intoWaitingRoom(Elements[i].nestedRels[j]);
}
}
function intoMainForm(relation)
{
if (relation == 'none') return;
var Elements = hiddenFormFieldsPointers[relation];
for (var i=0;i<Elements.length;i++)
{
var insertPoint = document.getElementById(relation+i);
insertPoint.parentNode.insertBefore(Elements[i],insertPoint);
if (Elements[i].nestedRels)
{
var fields = getAllFormFields(Elements[i]);
for (var j=0;j<fields.length;j++)
{
if (!fields[j].getAttribute('rel')) continue;
if (fields[j].checked || fields[j].selected) 
intoMainForm(fields[j].getAttribute('rel'));
}
}
}
}
function getAllFormFields(node)
{
var allFormFields = new Array;
var x = node.getElementsByTagName('input');
for (var i=0;i<x.length;i++)
allFormFields.push(x[i]);
var y = node.getElementsByTagName('option');
for (var i=0;i<y.length;i++)
allFormFields.push(y[i]);
return allFormFields;
}
/** ULTRA-SIMPLE EVENT ADDING **/
function addEvent(obj,type,fn)
{
if (obj.addEventListener)
obj.addEventListener(type,fn,false);
else if (obj.attachEvent)
obj.attachEvent("on"+type,fn);
}
addEvent(window,"load",prepareForm);
/** PUSH AND SHIFT FOR IE5 **/
function Array_push() {
var A_p = 0
for (A_p = 0; A_p < arguments.length; A_p++) {
this[this.length] = arguments[A_p]
}
return this.length
}
if (typeof Array.prototype.push == "undefined") {
Array.prototype.push = Array_push
}
function Array_shift() {
var A_s = 0
var response = this[0]
for (A_s = 0; A_s < this.length-1; A_s++) {
this[A_s] = this[A_s + 1]
}
this.length--
return response
}
if (typeof Array.prototype.shift == "undefined") {
Array.prototype.shift = Array_shift
}