Log in

View Full Version : Dynamic JavaScript form


bielen
08-31-2009, 03:27 PM
Hello:

I have a dynamically generated form with multiple users. Each user has two

For each user I have two radio buttons and a text field.

John __ Approved __Approved with Errors Comments _____________
Mary __ Approved __Approved with Errors Comments _____________
Jim __ Approved __Approved with Errors Comments _____________

<Submit>

Each form field is independently named

Status_0, Status_1, Status_2 for the Approved with errors is value "2"
Comments_0, Comments_1, Comments_2

The number of users is variable based on the criteria provided.

If a user selects "Approved with Errors", I want to require a comment in the text field. If not selected, I want an alert box to appear.

Any examples or suggestions on how to approach? I'm under a tight deadline.

Thank you
thenajsays
08-31-2009, 03:36 PM
lets see the actual code please
bielen
08-31-2009, 04:26 PM
Here's the page, the validation is not working:


<html>
<head>
<script language="JavaScript" type="text/javascript">
function validateComment(timesheet)
{
var Status = document.getElementById('Status').value;
var Comments = document.getElementById('Comments').value;

if(Status=='2' && Comments=='')
{
alert("Please enter a comment for" + document.getElementById('Username').value);
return false;
}
}

</script>
</head>
<body>
<form name="timesheet" method="GET" action="test.html" onsubmit="return validateComment(this)">
<table border="0" id="timesheet">
<tr>
<td>Usernmame</td>
<td>DeviceName</td>
<td>Comment</td>
</tr>
<tr>
<td><input readonly type="text" name="Username_0" size="25" maxlength="25" value="John" /></td>
<td><input type="radio" name="Status_0" id="Status" value="1">Approved <input type="radio" name="radio" id="Status" value="2">Approved with Errors</td>
<td><input type="text" name="Comments_0" size="25" maxlength="25" value="" /></td>
</tr>
<tr>
<td><input readonly type="text" name="Username_1" size="25" maxlength="25" value="Mary" /></td>
<td><input type="radio" name="Status_1" id="Status" value="1">Approved <input type="radio" name="radio" id="Status" value="2">Approved with Errors</td>
<td><input type="text" name="Comments_1" size="25" maxlength="25" value="" /></td>
</tr>
<tr>
<td><input readonly type="text" name="Username_2" size="25" maxlength="25" value="Jim" /></td>
<td><input type="radio" name="Status_2" id="Status" value="1">Approved <input type="radio" name="radio" id="Status" value="2">Approved with Errors</td>
<td><input type="text" name="Comments_2" size="25" maxlength="25" value="" /></td>
</tr>
<tr>
<td colspan="3" align="center"><input type="submit" name="Submit" id="Submit" value="Submit"></td>
</tr>
</table>
</form>
</body>
</html>
thenajsays
08-31-2009, 05:32 PM
try this on one of your comments instead:

<input type="text" name="Comments_0" size="25" maxlength="25" value="" onBlur="if(this.value==''){alert('Please enter a comment')" />