Hello, I have been working for days on my web Form assignment and editing my html to call my functions to validate the user entered data, but to no avail.I finally decided to place the functions in the head. But, I still cannot make a call. Below is my code. Please help. Thanks in advance.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Subscription Form</title>
<script type="text/javascript">
function validateSubscriptionForm () {
//declare variables to check if textfields are blank
var blankEmail=chkEmail ();
var blankFname=chkFN ();
var blankLname=chklN ();
var blankAddr=chkAddr ();
var blankCity=chkCity ();
var blankSt=chkSt ();
var blankZipCode=chkZ ();
var blankTel=chkTel ();
}
function chkEmail (){
if (document.Subscription_Form.getElementById("eMailTextField").value == "") {
alert("Please fill in required e-mail address");
document.Subscription_Form.eMailTextField.focus();//repositions the cursor back to the email textfield
}
}
function chkFN () {
if (document.Subscription_Form.getElementById("firstNameTextField").value == "") {
alert("Please fill in required First Name");
document.Subscription_Form.firstNameTextField.focus();
}
}
function chklN (){
if (document.getElementById("lastNameTextField").value == "") {
alert("Please fill in required Last Name");
document.Subscription_Form.lastNameTextField.focus();
}
}
function chkAddr (){
if (document.getElementById("addressTextField").value == "") {
alert("Please fill in required Address");
document.Subsciption_Form.addressTextField.focus();
}
}
function chkCity() {
if (document.getElementById("cityTextField").value == "") {
alert("Please fill in required City");
document.Subscription_Form.cityTextField.focus();
}
}
function chkSt () {
if (document.getElementById("stateTextField").value == "") {
alert("Please fill in required State");
document.Subscription_Form.stateTextField.focus();
}
}
function chkZ (){
if (document.getElementById("zipCodeTextField").value == "") {
alert("Please fill in required Zip Code");
document.Subscription_Form.zipCodeTextField.focus();
}
if (isNaN(zipCodeTextField.value) == true) {
alert("Please enter a valid Zip Code Number");
zipCodeTextField.focus();
zipCodeTextField.select();
}
}
function chkTel () {
if (document.getElementById("telephoneTextField").value == "") {
alert("Please fill in required Telephone");
document.Subscription_Form.telephoneTextField.focus();
}
}
</script>
<link href="form_style_1.css" rel="stylesheet" title="Subscription Form Style 1" type="text/css" />
<!--create script to link this subscription form to the acknowledgement page -->
</head>
<body>
<!--insert form and design form layout with a header -->
<form name="Subscription_Form" action="" method="post" id="form1"><!--form1 sets style of subscription form-->
<h1>Subscription Form</h1>
<p align="center">The <span style="color:#F00">*</span> denotes required information</p>
<p>
<label><span style="color:#F00"> * </span> Email: </label>
<input style="position:absolute; left: 116px;" type="text" size="30" align="right" id="eMailTextField" onclick="chkEmail()" /><br />
</p>
<p>
<label><span style="color:#F00"> * </span> First Name: </label>
<input style="position:absolute; left: 116px;" type="text" size="30" align="right" id="firstNameTextField" /><br />
</p>
<p>
<label><span style="color:#F00"> * </span> Last Name: </label>
<input style="position:absolute; left: 116px;" type="text" size="30" align="right" id="lastNameTextField" /><br />
</p>
<p>
<label><span style="color:#F00"> * </span> Address: </label>
<input style="position:absolute; left: 116px;" type="text" size="30" align="right" id="addressTextField" /><br />
</p>
<p>
<label><span style="color:#F00"> * </span> City: </label>
<input style="position:absolute; left: 115px;" id="cityTextField" type="text" size="30" maxlength="30" /><br />
</p>
<p>
<label><span style="color:#F00"> * </span> State: </label>
<input style="position:absolute; left: 116px;" type="text" size="2" maxlength="2" align="right" id="stateTextField" /><br />
</p>
<p>
<label><span style="color:#F00"> * </span> Zip Code: </label>
<input style="position:absolute; left: 116px;" type="text" size="5" maxlength="5" align="right" id="zipCodeTextField" /><br />
</p>
<p>
<label><span style="color:#F00"> * </span> Telephone: </label>
<input style="position:absolute; left: 116px;" type="text" size="30" maxlength="30" align="right" id="telephoneTextField" /><br />
</p>
<input style="position:absolute; left: 188px;" type="submit" value="Submit" onclick="validateSusbscriptionForm()" />
Ads