In IE none of my validation checks work. I can leave the entire form empty, click the submit button, and the form goes through. Not one pop up box asking for correct data.
In Firefox my form checks everything but my state code (it's supposed to force you to choose one state to make it a valid option), my Zip code, and my second password box do not check for validation. I do not need to choose a state, my Zip code will only throw an error message if I leave it blank (it's supposed to check for 5 numerical digits), and my second password field can be anything (doesn't have to match the first password field, which it should).
I have not checked my form out in Chrome as of yet.
My questions are:
1) How come nothing is checked in IE?
2) Why do the state, zip, and second password entries not work in Firefox?
3) Did I check my second password properly? It is supposed to equal whatever is entered into the first password box.
Any, and all, help would be greatly appreciated. Thank you.
Here is my code:
<html>
<head>
<title>Pizza Delivery Customer Login Form</title>
<script type="text/javascript">
function Validate()
{
var FirstName = document.getElementById("txtFName");
var LastName = document.getElementById("txtLName");
var Email = document.getElementById("txtEmail");
var Phone = document.getElementById("txtPhone");
var Address = document.getElementById("txtAddress");
var City = document.getElementById("txtCity");
var State = document.getElementById("lstState");
var ZIP = document.getElementById("txtZip");
var Password = document.getElementById("txtPassword");
var Check = document.getElementById("txtPasswordCheck");
if (FirstName.value.length = = 0)
{
alert("Please Enter Your First Name.");
FirstName.focus();
FirstName.select();
return false;
}
if (LastName.value.length = = 0)
{
alert("Please Enter Your Last Name.");
LastName.focus();
LastName.select();
return false;
}
if (Email.value.indexOf("@") == -1 || Email.value.indexOf(".") == -1)
{
alert("Please Enter A Valid Email Address.");
Email.focus();
Email.select();
return false;
}
var PhoneCheck = /^\(\d\d\d\) \d\d\d-\d\d\d\d$/;
if (!PhoneCheck.test(Phone.value))
{
alert("Please Enter A Valid Phone Number In The Form Of (###) ###-####.");
Phone.select();
Phone.focus();
return false;
}
if (Address.value.length = = 0)
{
alert("Please Enter Your Address.");
Address.focus();
Address.select();
return false;
}
if (City.value.length = = 0)
{
alert("Please Enter Your Home City.");
City.focus();
City.select();
return false;
}
if (State.selectedIndex == 0))
{
alert("Please Select Your Home State.");
State.focus();
return false;
}
if (isNaN(ZIP.value) || ZIP.value.length != 5)
{
alert("Please Enter A Valid 5 Digit Zip Code.");
ZIP.focus();
ZIP.select();
return false;
}
if (Password.value.length = = 0)
{
alert("Please Enter Your Password.");
Password.focus();
Password.select();
return false;
}
if (Check.value != Password.value)
{
alert("Please Re-Enter Your Password.");
Check.focus();
Check.select();
return false;
}
return false;
}
</script>
<link href="../styles/PizzaFormLayout.css" rel="stylesheet" type="text/css" >
</head>
<body>
<div id="Container">
<h2 style="text-align: center">Customer Login</h2>
<div id="Logo">
<img src="../Images/delivery_man.jpg" alt="logo" width="200px"/>
</div><!-- End of Logo -->
<div id="LoginForm">
<form id="LoginForm" name="LoginForm"
action="http://itweb.fvtc.edu/responder.php" method="get">
<div id="FormFields">
<fieldset>
<legend>
Customer
</legend>
<label for="txtFName">First Name: </label>
<input type="text" name="txtFName" id="txtFName" autofocus required />
<script type="text/javascript">
// Fallback code for IE immediate autofocus
if (!("autofocus" in document.createElement("input")))
{
document.getElementById("txtFirstName").focus();
}
</script>
<label for="txtLName">Last Name: </label>
<input type="text" name="txtLName" id="txtLName" required />
<label for="txtEmail">Email: </label>
<input type="email" name="txtEmail" id="txtEmail" required />
<label for="txtPhone">Phone: </label>
<input type="text" name="txtPhone" id="txtPhone" pattern="\(\d\d\d\) \d\d\d-\d\d\d\d" placeholder="(###) ###-####" required />
</fieldset>
<fieldset>
<legend>
Address
</legend>
<label for="txtAddress">Address: </label>
<input type="text" name="txtAddress" id="txtAddress" required />
<label for="txtCity">City: </label>
<input type="text" name="txtCity" id="txtCity" required />
<label for="lstState">State: </label>
<select name="lstState" id="lstState">
<option selected>Select</option>
<option value="AK">AK</option>
<option value="AL">AL</option>
<option value="AR">AR</option>
<option value="AZ">AZ</option>
<option value="CA">CA</option>
<option value="CO">CO</option>
<option value="CT">CT</option>
<option value="DC">DC</option>
<option value="DE">DE</option>
<option value="FL">FL</option>
<option value="GA">GA</option>
<option value="HI">HI</option>
<option value="IA">IA</option>
<option value="ID">ID</option>
<option value="IL">IL</option>
<option value="IN">IN</option>
<option value="KS">KS</option>
<option value="KY">KY</option>
<option value="LA">LA</option>
<option value="MA">MA</option>
<option value="MD">MD</option>
<option value="ME">ME</option>
<option value="MI">MI</option>
<option value="MN">MN</option>
<option value="MO">MO</option>
<option value="MS">MS</option>
<option value="MT">MT</option>
<option value="NC">NC</option>
<option value="ND">ND</option>
<option value="NE">NE</option>
<option value="NH">NH</option>
<option value="NJ">NJ</option>
<option value="NM">NM</option>
<option value="NV">NV</option>
<option value="NY">NY</option>
<option value="OH">OH</option>
<option value="OK">OK</option>
<option value="OR">OR</option>
<option value="PA">PA</option>
<option value="RI">RI</option>
<option value="SC">SC</option>
<option value="SD">SD</option>
<option value="TN">TN</option>
<option value="TX">TX</option>
<option value="UT">UT</option>
<option value="VT">VT</option>
<option value="VA">VA</option>
<option value="WA">WA</option>
<option value="WV">WV</option>
<option value="WI">WI</option>
<option value="WY">WY</option>
</select>
<label for="txtZip">Zip: </label>
<input type="text" name="txtZip" id="txtZip" placeholder="5 digit ZIP code" required />
</fieldset>
<fieldset>
<legend>
Security
</legend>
<label for="txtPassword">Password: </label>
<input type="password" name="txtPassword" id="Password" required/>
<label for="txtPasswordCheck">Re-Enter Password: </label>
<input type="password" name="txtPasswordCheck" id="PasswordCheck" placeholder="Re-Enter Password" required />
</fieldset>
</div><!-- End of Form Fields -->
<div id="FormButtons">
<input type="submit" value="Create Account" onclick="return Validate()"/>
<input type="reset" />
</div><!-- End of Form Buttons -->
</form>
</div><!-- End of Order Form -->
</div><!-- End of Container -->
</body>
</html>

New Topic/Question
Reply



MultiQuote




|