19
Ok ,i have to create a page to allow entry of user information;all fields must be validated and error displayed otherwise
* First Name (limit 25 characters)
* Last Name (limit 25 characters)
* Street Address (limit 45 characters)
* City (limit 25 characters)
* State (2 character code )
* Zip Code (5 digits only, must be numeric)
* Date of Birth (mm/dd/yyyy format, day, month, and year must be valid)
I am been trying to validate all fields, but i got a hard time doing it ...
This is the code so far :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<SCRIPT LANGUAGE="JavaScript">
function isValidDate(dateStr) {
var datePat = /^(\d{1,2})(\/|)(\d{1,2})\2(\d{4})$/;
var matchArray = dateStr.match(datePat); // is the format ok?
if (matchArray == null) {
alert("Date is not in a valid format.")
return false;
}
month = matchArray[1]; // parse date into variables
day = matchArray[3];
year = matchArray[4];
if (month < 1 || month > 12) { // check month range
alert("Month must be between 1 and 12.");
return false;
}
if (day < 1 || day > 31) {
alert("Day must be between 1 and 31.");
return false;
}
if ((month==4 || month==6 || month==9 || month==11) && day==31) {
alert("Month "+month+" doesn't have 31 days!")
return false
}
if (month == 2) { // check for february 29th
var isleap = (year % 4 == 0 && (year % 100 != 0 || year % 400 == 0));
if (day>29 || (day==29 && !isleap)) {
alert("February " + year + " doesn't have " + day + " days!");
return false;
}
}
return true; // date is valid
}
// End -->
</script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body>
<form id="form1" name="form1" method="post" action="">
<label>First Name
<input name="First" type="text" id="First" maxlength="25" />
</label>
</form>
<form id="form2" name="form2" method="post" action="">
<label>Last Name
<input name="Last" type="text" id="Last" maxlength="25" />
</label>
</form>
<form id="form3" name="form3" method="post" action="">
<label>Street Address
<input name="Street" type="text" id="Street" value="" maxlength="45" />
</label>
</form>
<form id="form4" name="form4" method="post" action="">
<label>City
<input name="City" type="text" id="City" maxlength="25" />
</label>
</form>
<form id="form5" name="form5" method="post" action="">
<label>State
<select name="State" size="1" id="State">
<option>FL</option>
<option>GA</option>
<option>NY</option>
</select>
</label>
</form>
<form id="form6" name="form6" method="post" action="">
<label>Zip
<input name="Zip" type="text" id="Zip" maxlength="5" />
</label>
</form>
<form id="form8" name="form8" method="post" action="">
<label>Submit
<input type="submit" name="Submit" id="Submit" value="Submit" />
</label>
</form>
Your Birth Date:
<input type=text name=date size=10 maxlength=10> (in MM/DD/YYYY format)
<input type=submit value="Submit Date">
</form>
</body>
</html>
Any help will be appreciated.
