PDA

View Full Version : Validation script need help



robski_g
Apr 12th, 2007, 11:54 AM
Hi guys,
I need to add an email validation field to this form, so far if a field is incomplete or incorrect the script initiates an alert to warn the user they have made an error. I basically need a function that validates an email address field but if the user enters incorrect information they get an alert as with the rest of the fields on my form. Also I want the form to link to a 'Thank you for registering' page after the submit button has been clicked and the form has fully validated. Could someone please show me a way to possibly do this. Cheers.

<html>

<head>

<script type="text/javascript">

<!--

function validate_form ()
{

valid = true;

if ( document.contact_form.contact_name.value == "" )
{
alert ( "Please fill in the 'Your Name' box.");
valid = false;
}

if ( ( document.contact_form.gender[0].checked == false ) && (
document.contact_form.gender[1].checked == false ) )
{
alert ( "Please choose your gender: Male or Female" );
valid = false;
}

if ( document.contact_form.age.selectedIndex == 0 )
{
alert ( "Please select your age.");
valid = false;
}

if ( document.contact_form.terms.selectedIndex == false )
{
alert ( "Please check the Terms and Conditions box." );
valid = false;

}

return valid;
}
//-->

</script>

</head>

<body bgcolor="#ffffff">

<form name="contact_form" method="post"
action="www.google.com" onSubmit="return validate_form ();">

<h1>Please Enter Your Details Below</h1>

<p>Your Name: <input type="text" name="contact_name"></p>

<p>Your Gender: <input type="radio" name="gender" value="Male"> Male
&nbsp; <input type="radio" name="gender" value="Female"> Female</p>

<p>Your Age:

<select name="age">
<option value="">Please select an option</option>
<option value="0-18 years">0-18 years</option>
<option value="18-30 years">18-30 years</option>
<option value="30-45 years">30-45 years</option>
<option value="45-60 years">45-60 years</option>
<option value="60+ years">60+ years</option>
</select>

<p> Do you agree to the terms and conditions?
<input type="checkbox" name="terms" value="yes">yes</p>

<p><input type="submit" name="send" value"Send Details"></p>

</form>
</body>
</html>

Philip M
Apr 12th, 2007, 12:49 PM
You have not got a textbox for the email address, but the validation code might be:-

function validateEmail () {
if (/^([a-z0-9])(([\-.]|[_]+)?([a-z0-9]+))*(@)([a-z0-9])((([-]+\.)?([a-z0-9\.]+))?)*((.[a-z]{2,3})?(.[a-z]{2,6}))$/i.test(document.contact_form.emailAddress.value)) {
valid = true;
}
else {
alert ("Invalid email address - please re-enter");
document.contact_form.emailAddress = "";
document.contact_form.emailAddress.focus();
return false;
}
}


The redirect should be done server-side, not client side.

robski_g
Apr 12th, 2007, 11:59 PM
Nice one for for that mate. Is it not possible for the redirect to be done client side?

Philip M
Apr 13th, 2007, 07:48 AM
Nice one for for that mate. Is it not possible for the redirect to be done client side?

No. As only the server knows that the submission has been successful.