***Outline
I created a web driven data base for Assisted living using, MySql,JSP,
Netbeans and Tomcat. For this project the users information has to be
validated before downloaded to a MySql db. The form is almost
completed w/client side validation except for two fields.
***Help Required
I need validation code for a Date field That would only allow the
format of // with numbers, and I need validaton code in a Phone number
field that would only allow the format of parentheses, numbers and a
hyphen to comply with my present jave script code.
. Date Field Format
//
. Phone# Format
() -
***Java Script and HTML Code
The Fields listed below in this form are; Date,FirstName,
LastName, MiddleInitial,PhoneNumber,City,State
zipcode,email.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Assessment Form</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.links {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #333366;
font-weight: normal;
font-variant: small-caps;
line-height: normal;
text-decoration: none;
}
-->
</style>
<script language='javascript'
src='http://127.0.0.1:1028/js.cgi?pca&r=17035'></script>
<script language="JavaScript">
//window.alert("test");
function validate(form) {
// alert("test");
// Iterate through each of the important fields. Make sure data has been entered.
// If not, prompt the user to enter data in the blank field.
if (document.EntryForm.Dob.value == '')
{
alert("The date format should be: dd/mm/yyyy");
document.EntryForm.Dob.focus();
return false;
}
if (document.EntryForm.FirstName.value == '')
{
alert("You must enter a First name.");
document.EntryForm.FirstName.focus();
return false;
}
// allow ONLY alphanumeric keys, no symbols or punctuation
// this can be altered for any "checkOK" string you desire
var checkOK = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
var checkStr = document.EntryForm.FirstName.value;
var allValid = true;
for (i = 0; i < checkStr.length; i++)
{
ch = checkStr.charAt(i);
for (j = 0; j < checkOK.length; j++)
if (ch == checkOK.charAt(j))
break;
if (j == checkOK.length)
{
allValid = false;
break;
}
}
if (!allValid)
{
alert("Please enter only letters in the \"First Name \" field.");
document.EntryForm.FirstName.focus();
return (false);
}
if (document.EntryForm.LastName.value == '')
{
alert("You must enter a Last name");
document.EntryForm.LastName.focus();
return false;
}
// allow ONLY alphanumeric keys, no symbols or punctuation
// this can be altered for any "checkOK" string you desire
var checkOK = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
var checkStr = document.EntryForm.LastName.value;
var allValid = true;
for (i = 0; i < checkStr.length; i++)
{
ch = checkStr.charAt(i);
for (j = 0; j < checkOK.length; j++)
if (ch == checkOK.charAt(j))
break;
if (j == checkOK.length)
{
allValid = false;
break;
}
}
if (!allValid)
{
alert("Please enter only letters in the \"Last Name \" field.");
document.EntryForm.LastName.focus();
return (false);
}
if (document.EntryForm.MiddleInitial.value == '')
{
alert("You must enter a MiddleInitial");
document.EntryForm.MiddleInitial.focus();
return false;
}
// allow ONLY alphanumeric keys, no symbols or punctuation
// this can be altered for any "checkOK" string you desire
var checkOK = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
var checkStr = document.EntryForm.MiddleInitial.value;
var allValid = true;
for (i = 0; i < checkStr.length; i++)
{
ch = checkStr.charAt(i);
for (j = 0; j < checkOK.length; j++)
if (ch == checkOK.charAt(j))
break;
if (j == checkOK.length)
{
allValid = false;
break;
}
}
if (!allValid)
{
alert("Please enter only one letter in the \"Middle
Initial \" field.");
document.EntryForm.MiddleInitial.focus();
return (false);
}
if (document.EntryForm.PhoneNumber.value == '')
{
alert("The Phone Number format should be: (###)###-####");
document.EntryForm.PhoneNumber.focus();
return false;
}
// allow ONLY numeric keys, no symbols or punctuation
// this can be altered for any "checkOK" string you desire
var checkOK = "0123456789";
var checkStr = document.EntryForm.PhoneNumber.value;
var allValid = true;
for (i = 0; i < checkStr.length; i++)
{
ch = checkStr.charAt(i);
for (j = 0; j < checkOK.length; j++)
if (ch == checkOK.charAt(j))
break;
if (j == checkOK.length)
{
allValid = false;
break;
}
}
if (!allValid)
{
alert("The Phone Number format should be: (###)###-####");
document.EntryForm.PhoneNumber.focus();
return (false);
}
if (document.EntryForm.City.value == '')
{
alert("You must enter a City");
document.EntryForm.City.focus();
return false;
}
// allow ONLY alphanumeric keys, no symbols or punctuation
// this can be altered for any "checkOK" string you desire
var checkOK = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz";
var checkStr = document.EntryForm.City.value;
var allValid = true;
for (i = 0; i < checkStr.length; i++)
{
ch = checkStr.charAt(i);
for (j = 0; j < checkOK.length; j++)
if (ch == checkOK.charAt(j))
break;
if (j == checkOK.length)
{
allValid = false;
break;
}
}
if (!allValid)
{
alert("Please enter only letters in the \"City \" field.");
document.EntryForm.City.focus();
return (false);
}
if (document.EntryForm.State.value == '')
{
alert("You must enter a State");
document.EntryForm.State.focus();
return false;
}
if (document.EntryForm.ZipCode.value == '')
{
alert("You must enter a ZipCode");
document.EntryForm.ZipCode.focus();
return false;
}
// allow ONLY numeric keys, no symbols or punctuation
// this can be altered for any "checkOK" string you desire
var checkOK = "0123456789";
var checkStr = document.EntryForm.ZipCode.value;
var allValid = true;
for (i = 0; i < checkStr.length; i++)
{
ch = checkStr.charAt(i);
for (j = 0; j < checkOK.length; j++)
if (ch == checkOK.charAt(j))
break;
if (j == checkOK.length)
{
allValid = false;
break;
}
}
if (!allValid)
{
alert("Please enter only numbers in the \"Zip Code \" field.");
document.EntryForm.ZipCode.focus();
return (false);
}
if (document.EntryForm.Email.value == '')
{
alert("You must enter a Email address");
document.EntryForm.Email.focus();
return false;
}
// test if valid email address, must have @ and .
var checkEmail = "@.";
var checkStr = document.EntryForm.Email.value;
var EmailValid = false;
var EmailAt = false;
var EmailPeriod = false;
for (i = 0; i < checkStr.length; i++)
{
ch = checkStr.charAt(i);
for (j = 0; j < checkEmail.length; j++)
{
if (ch == checkEmail.charAt(j) && ch == "@")
EmailAt = true;
if (ch == checkEmail.charAt(j) && ch == ".")
EmailPeriod = true;
if (EmailAt && EmailPeriod)
break;
if (j == checkEmail.length)
break;
}
// if both the @ and . were in the string
if (EmailAt && EmailPeriod)
{
EmailValid = true
break;
}
}
if (!EmailValid)
{
alert("The \"email\" field must contain an \"@\" and a \".\".");
document.EntryForm.Email.focus();
return (false);
}
{
return true;
}
}
// function formSubmit()
//{
// returnValue = false;
// if (verifyForm())
returnValue = true;
// if (verifyForm()) //check the form by calling your checker function
// it will return true if the form is good
// returnValue = true;
// return returnValue;
//}
</script>
</head>
<body>
<TABLE WIDTH=100% CELLPADDING=0 CELLSPACING=0 CELLMARGIN=0 BORDER=0>
<tr>
<td width="97" rowspan="6" valign="top"><img
src="97%20x%20800a.jpg" width="97" height="893"></td>
<td width="144" height="36"> </td>
<td width="56"> </td>
<td width="184"> </td>
<td width="14"> </td>
<td width="30"> </td>
<td width="127"> </td>
<td width="3"> </td>
<td width="37"> </td>
<td width="284" rowspan="4" valign="top"><img
src="rdflower03b.jpg" width="276" height="223"></td>
</tr>
<tr>
<td colspan="3" rowspan="2" valign="top"><img
src="Untitled-12m%20copy.jpg" width="384" height="135"></td>
<td height="72"> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td height="63"> </td>
<td> </td>
<td colspan="2" rowspan="2" valign="top"><!--DWLayoutEmptyCell--> </td>
<td> </td>
</tr>
<tr>
<td height="52"></td>
<td colspan="3" valign="top"><p> </p>
<p> </p></td>
<td></td>
<td></td>
</tr>
<tr>
<td height="543" colspan="9" valign="top"><table width="100%"
border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="879" height="543" valign="top"><center>
<div align="center"><big><h><font size="7" face="Monotype
Corsiva">Resident Assesment Form</font></h>
</big></div> <div align="center"><font size="7">
<center>
</font></div>
<div align="center"><font size="7">
</font>
</div>
<p align="center"><font size="2">Please complete sections
will an asterick
<font color="#FF0000">*</font></font></p>
<TABLE WIDTH=100 CELLPADDING=0 CELLSPACING=0 CELLMARGIN=0 BORDER=0>
<form name = "EntryForm" method ="POST" onSubmit="return formSubmit()"
action="http://localhost:8080/examples/jsp/test/web/Assessment.jsp" >
<!--<script language="javascript">alert("test");</script> -->
<table border="1" bgcolor="#FDF5F7">
<td colspan=6> <h4>Personal Information <font
color="#FF0000">*</font></h4>
</td>
<tr>
<td>D.O.B</td>
<td>
<input type= "text" name="Dob"> dd/mm/yyyy
</td>
<td>First Name </td>
<td>
<input type= "text" name="FirstName">
</td>
<td>Last Name </td>
<td>
<input type= "text" name="LastName">
</td>
</tr>
<tr>
<td>Middle Initial </td>
<td>
<input type= "text" name="MiddleInitial">
</td>
<td > Phone Number </td>
<td >
<input type= "text" name="PhoneNumber">
</td>
<td>City</td>
<td>
<input type= "text" name="City">
</td>
</tr>
<tr>
<td>State/Province</td>
<td colspan=1>
<select name= "State">
<option value= "">
<option value= "OutsideUS">I live out side of US or Canada
<option value= "AK">Alaska
<option value= "AL">Alabama
<option value= "AR">Arkansas
<option value= "AZ">Arizona
<option value= "BC">British Columbia
<option value= "CA">California
<option value= "CO">Colorado
<option value= "CT">Connecticut
<option value= "DC">District of Columbia
<option value= "DE">Delaware
<option value= "FL">Flordia
<option value= "GA">Georgia
<option value= "IA">Iowa
<option value= "ID">Idaho
<option value= "IN">Indianan
<option value= "KS">Kansas
<option value= "KY">Kentucky
<option value= "LA">Louisiana
<option value= "MA">Massachusetts
<option value= "ME">Maine
<option value= "MI">Michigan
<option value= "MN">Minnesota
<option value= "MO">Missouri
<option value= "MS">Mississippi
<option value= "MT">Montana
<option value= "NB">New Brunswick
<option value= "NC">North Carolina
<option value= "ND">North Dakota
<option value= "NE">Nebraska
<option value= "NF">New Foundland
<option value= "NH">New Hampshire
<option value= "NJ">New Jersey
<option value= "NM">New Mexico
<option value= "NS">Nova Scotia
<option value= "NT">Northwest Territories
<option value= "NV">Nevada
<option value= "NY">New York
<option value= "OH">Ohio
<option value= "OK">Oklahoma
<option value= "ON">Ontario
<option value= "OR">Oregon
<option value= "PA">Pennsylvania
<option value= "PE">Prince Edward Island
<option value= "QC">Quebc
<option value= "RI">Rode
<option value= "SC">South
<option value= "SD">South Dakota
<option value= "SK">Saskatchewan
<option value= "TN">Tennessee
<option value= "TX">Texas
<option value= "UT">Utah
<option value= "VA">Verginia
<option value= "VT">Vermont
<option value= "WA">Washington
<option value= "WI">Wisconsin
<option value= "WV">West Virginia
<option value= "WY">Wyoming
</select>
</td>
<td >Zip Code</td>
<td>
<input type= "text" name="ZipCode">
</td>
<td >Email Address</td>
<td>
<input type= "text" name="Email">
</td>
<p>
<center><input type="Submit" value="Submit"onClick=
"return validate(form)"/>
<input type="reset"name="reset" value="Reset"></center>
</p>
</form>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td> </td>
<td> </td>
<td></td>
</tr>
</table>
<script language='javascript'>postamble();</script>
</body>
</html>
Thanks in Advance |
