PDA

View Full Version : Web Form Script



Rave
11-17-2006, 12:50 AM
So far, I'm trying to get this form to work, using an E-Mail Address, Zip Code, and Phone Number.

Now, the problem is the fact that it won't seem to validate properly, yet JavaScript Consol detected no errors..

Also, I'm going to be putting in a password soon. Here is the code:



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
xml:lang="en">

<head>

<title>PUT YOUR PAGE TITLE HERE</title>

<script type="text/javascript"
language="JavaScript 2.1">
<!--

function ProcessForm()
{
var strPhoneNumber = new String("");
var strZipCode = new String("");
var strEmailAddress = new String("");
var fObjPassword = new Object();
var fObjConfirm = new Object();
var strReturnMsg = new String("");

strPhoneNumber = window.document.getElementById("txtPhoneNumber").value;
strZipCod = window.document.getElementById("txtZipCode").value;
strEmailAddress = window.document.getElementById("txtEmail").value;
fObjPassword = window.document.getElementById("txtPassword");
fObjConfirm = window.document.getElementById("txtConfirm");

strReturnMsg = "Bleh!";

window.alert(strReturnMsg);
}

function ValidateForm(FormToCheck)
{
if(CheckForEmpty(FormToCheck.txtPhoneNumber.value) == true)
{
window.alert("You need to enter a phone number!");
FormToCheck.txtPhoneNumber.select();
return false;
}else if(CheckIfValid1(FormToCheck.txtPhoneNumber.value) == false){
window.alert("Your phone number is not valid!");
FormToCheck.txtPhoneNumber.select();
return false;
}else{
return true;
}

if(CheckForEmpty2(FormToCheck.txtZipCode.value) == true)
{
window.alert("You need to enter a zip code!");
FormToCheck.txtZipCode.select();
return false;
}else if(CheckIfValid2(FormToCheck.txtZipCode.value) == false) {
window.alert("Your zip code is not valid!");
FormToCheck.txtZipCode.select();
return false;
}else{
return true;
}
if(CheckForEmpty3(FormToCheck.txtEmail.value) == true)
{
window.alert("You need to enter an e-mail address!");
FormToCheck.txtEmail.select();
return false;
}else if(CheckIfValid3(FormToCheck.txtEmail.value) == false) {
window.alert("Your e-mail address is not valid!");
FormToCheck.txtEmail.select();
return false;
}else{
return true;
}
if(ValidatePassword(fObjPassword,fObjConfirm) == true)
{
return true;
}else{
return false;
}
}

function ValidatePassword(Password,PasswordConfirm)
{
var bolIsError = new Boolean(false);
var strErrorMsg = new String("");
var objError = new Object();

if((CheckForEmpty(Password.value) == true))
{
bolIsError = true;
strErrorMsg = "You must type a valid password!";
objError = Password;
}else if((CheckForEmpty(PasswordConfirm.value))){
bolIsError = true;
strErrorMsg = "You must confirm your password!";
objError = PasswordConfirm;
}else if((Password.value)!=(PasswordConfirm.value)){
bolIsError = true;
strErrorMsg = "Both fields must match!";
objError = Password;
}else if(InvalidLength(Password.value,7,11)){
bolIsError = true;
strErrorMsg = "Your password must be between 7 and 11 characters long!";
objError = Password;
}else if(InvalidChars(Password.value)){
bolIsError = true;
strErrorMsg = "You cannot use those characters in your password!";
objError = Password;
}else if(MeetMinReqs(Password.value)){
bolIsError = true;
strErrorMsg = "Your password MUST contain an uppercase letter, ";
strErrorMsg += "a lowercase letter, and a number!";
objError = Password;
}//end if

if(bolIsError == true)
{
window.alert(strErrorMsg);
objError.select();
return false;
}else{
return true;
}//end if
}//end ValidatePassword

function CheckForEmpty(FieldToCheck)
{
var onlySpacesRE = /^\s+$/;

if((FieldToCheck.match(onlySpacesRE)) ||
(FieldToCheck == null) ||
(FieldToCheck == ""))
{
return true;
}else{
return false;
}//end if

}//end CheckForEmpty

function CheckForEmpty2(FieldToCheck)
{
var onlySpacesRE = /^\s+$/;

if((FieldToCheck.match(onlySpacesRE)) ||
(FieldToCheck == null) ||
(FieldToCheck == ""))
{
return true;
}else{
return false;
}//end if
}
function CheckForEmpty3(FieldToCheck)
{
var onlySpacesRE = /^\s+$/;

if((FieldToCheck.match(onlySpacesRE)) ||
(FieldToCheck == null) ||
(FieldToCheck == ""))
{
return true;
}else{
return false;
}//end if
}
function InvalidLength(FieldToCheck,MinLength,MaxLength)
{
if(typeof(FieldToCheck) != "string")
{
FieldToCheck = FieldToCheck.toString();
}//end if

if((FieldToCheck.length < 7) ||
(FieldToCheck.length > 11))
{
return true;
}else{
return false;
}//end if
}//end InvalidLength

function InvalidChars(FieldToCheck)
{
var invalidCharsRE = /[^a-zA-Z0-9]/;

if(FieldToCheck.match(invalidCharsRE))
{
return true;
}else{
return false;
}//end if
}//end InvalidChars

function MeetMinReqs(FieldToCheck)
{
var lowercaseRE = /[a-z]+/g;
var uppercaseRE = /[A-Z]+/g;
var digitsRE = /[0-9]+/g;

if((FieldToCheck.search(lowercaseRE) == -1) ||
(FieldToCheck.search(uppercaseRE) == -1) ||
(FieldToCheck.search(digitsRE) == -1))
{
return true;
}else{
return false;
}//end if
}//end MeetMinReqs

function CheckIfValid1(FieldToCheck)
{
var phoneNumberMaskRE = /^\(\d{3}\)\s?\d{3}-\d{4}$/gi;

if(FieldToCheck.search(phoneNumberMaskRE) == -1)
{
return false;
}else{
return true;
}//end if
}//end CheckIfValid

function CheckIfValid2(FieldToCheck)
{
var validZipMaskRE = /^(\d{5}){1}(-\d{4})?$/gi;

if(FieldToCheck.search(validZipMaskRE) == -1)
{
return false;
}else{
return true;
}//end if
}//end CheckIfValid

function CheckIfValid3(FieldToCheck)
{
var validEmailMaskRE = /^(\w+@)([a-z0-9\-]{2,}.[a-z]{2,})$/gi;

if(FieldToCheck.search(validEmailMaskRE) == -1)
{
return false;
}else{
return true;
}//end if
}//end CheckIfValid

function CheckForEmpty(FieldToCheck)
{
var onlySpacesRE = /^\s+$/;

if((FieldToCheck.match(onlySpacesRE)) ||
(FieldToCheck == null) ||
(FieldToCheck == ""))
{
return true
}else{
return false;
}//end if
}//end CheckForEmpty

function ValidateReset()
{
var strQuestion = new String("");

strQuestion = "Are you sure you want to re-set this form?";

return window.confirm(strQuestion);
}//end ValidateReset()

function ClearField(FieldToClear,DefaultText)
{
if(FieldToClear.value == DefaultText)
{
FieldToClear.value = "";
}//end if
}//end ClearField()
// -->
</script>


</head>

Rave
11-17-2006, 04:54 PM
<body>

<h1 style="text-align:center">SCRIPT TITLE</h1>

<hr size="2"
width="85%" />

<form name = "frmMain"
id = "frmMain"
action = "JavaScript:ProcessForm();"
method = "post"
onSubmit = "JavaScript:return ValidateForm(this);"
onReset = "return ValidateReset();">
Enter your Phone Number ( Startig with Area Code ):
<br />
<input type="text"
name="txtPhoneNumber"
id="txtPhoneNumber"
size="25"
onFocus="javascript:ClearField(this,'Please Type Your Phone Number.');"
value="Please Type Your Phone Number." />
<br>
Enter your E-Mail Address:
<br />
<input type="text"
name="txtEmail"
id="txtEmail"
size="25"
onFocus="javascript:ClearField(this,'Please Type Your E-Mail Address.');"
value="Please Type Your E-Mail Address." />

<br>
Enter your Zip Code (Five Digits or Nine Digits):
<br />
<input type="text"
name="txtZipCode"
id="txtZipCode"
size="25"
onFocus="javascript:ClearField(this,'Please Type Your Zip Code.');"
value="Please Type Your Zip Code." />
<br />
Enter a password:
<br />
<input type="password"
name="txtPassword"
id="txtPassword"
size="15" />
<br /><br />
Confirm your password:
<br />

<input type="password"
name="txtConfirm"
id="txtConfirm"
size="15" />
<input type = "hidden"
name = "hideSubmitType"
id="hideSubmitType"
value = "Submit Type=Web Form" />
<br /><br />
<input type = "submit"
id = "btnSubmit"
name = "btnSubmit"
value = "Check Textbox" />
&nbsp;&nbsp;
<input type = "reset"
id = "btnReset"
name = "btnReset"
value = "Reset">
</form>

</body>


</html>