I’m learning, trying to create a simple web form, validate the form data, and pass the data to a php file.
After all of the field values are validated, they are not being passed to the php file.
<form action="/xxxxx.php" method="post" name="registration" onsubmit="return formValidation();">
I’ve change the form name to anything else…
<form action="/xxxxx.php" method="post" name="anythingelse" onsubmit="return formValidation();">
…the form works (without validation) and the field values are being passed to the php file. I’m receiving the completed form, so I know without validation the web form is working correctly.
So it would appear as though there is something wrong with the validation, I.E. the function(s) are returning false even after all functions have passed validation and presumably returned true.
Or something else is wrong. I don’t understand what’s wrong? I’d appreciate any help.
Here’s the code.
<script type="text/javascript">
function formValidation() {
var uname = document.registration.username;
var uadd = document.registration.city;
var ucountry = document.registration.country;
var uzip = document.registration.zip;
var uemail = document.registration.email;
var uphone = document.registration.phone;
{
if (allLetter(uname)) {
if (alphanumeric(uadd)) {
if (countryselect(ucountry)) {
if (allnumeric(uzip)) {
if (ValidateEmail(uemail)) {
if (validatePhone(uphone)) {
}
}
}
}
}
}
}
return false;
}
function validatePhone(uphone) {
var letters = /^[0-9a-zA-Z-]+$/;
if (uphone.value.match(letters)) {
return true;
}
else {
alert('Phone Number [Required]: Please enter your phone number (use this format, xxx-xxx-xxxx)');
uphone.focus();
return false;
}
}
function allLetter(uname) {
var letters = /^[A-Za-z ]+$/;
if (uname.value.match(letters)) {
return true;
}
else {
alert('Full Name [Required]: Please enter your full name (alphabet characters only)');
uname.focus();
return false;
}
}
function alphanumeric(uadd) {
var letters = /^[0-9a-zA-Z ]+$/;
if (uadd.value.match(letters)) {
return true;
}
else {
alert('City [Required]: Please enter your city (alphabet characters only)');
uadd.focus();
return false;
}
}
function countryselect(ucountry) {
if (ucountry.value == "Default") {
alert('State [Required]: Please select your State from the drop down list');
ucountry.focus();
return false;
}
else {
return true;
}
}
function allnumeric(uzip) {
var numbers = /^[0-9]+$/;
if (uzip.value.match(numbers)) {
return true;
}
else {
alert('ZIP code [Required]: Please enter your Zip Code (numbers only, use this format xxxxx)');
uzip.focus();
return false;
}
}
function ValidateEmail(uemail) {
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if (uemail.value.match(mailformat)) {
return true;
}
else {
alert('Email Address [Required]: You have entered an invalid email address. Please verify and correct your email address.');
uemail.focus();
return false;
}
}
</script>
<form name="registration" action="/xxxxxx.php" method="post" onsubmit="return formValidation();">
<input type="hidden" name="subject" value="xxxxx - Contact" />
<input type="hidden" name="redirect" value="confirmation.html" />
<div>
<strong>Email Address [Required]:</strong>
<input type="text" name="email" size="50" title="Please enter your email address" />
</div>
<div>
<span><strong>Company Name [Optional]:</strong></span> <span>
<input type="text" id="companyName" name="companyName" size="50" title="Please enter your company name" /></span>
</div>
<div>
<span><strong>Full Name:</strong></span> <span>
<input type="text" id="username" name="username" size="30" title="Please enter your full name" /></span>
</div>
<div>
<span><strong>Phone Number:</strong></span> <span>
<input type="text" id="phone" name="phone" size="17" title="Please enter your phone number" /></span>
<br />
<span><strong>Phone Ext. [Optional]:</strong></span> <span>
<input type="text" id="phoneExtn" name="phoneExtn" size="10" title="Please enter your phone extension" /></span>
</div>
<div>
<span><strong>City:</strong></span> <span>
<input type="text" id="city" name="city" size="25" title="Please enter your city" /></span>
<span><strong>State:</strong></span> <span>
<select id="country" name="country" title="Please select your state from the drop down list">
<option selected="" value="Default">Select a State</option>
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="DC">District of Columbia</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="GU">Guam</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA">Pennsylvania</option>
<option value="PR">Puerto Rico</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dokota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VI">Virgin Islands</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
</select></span>
</div>
<div>
<span><strong>Zip Code:</strong></span> <span>
<input type="text" id="zip" name="zip" size="10" title="Please enter your zip code" /></span>
</div>
<br />
<div id="qsadditionalRequirementsQuestion">
<strong>Briefly describe your purpose for contacting us today:</strong>
</div>
<div>
<textarea name="PurposeForContact" rows="5" cols="60"></textarea>
</div>
<div>
<input type="submit" name="submit" value="Submit" />
</div>
</form>
Your main
ifstatements are contained within random opening and closing braces.Try removing those random braces, adding
return true;inside of your last nestedifstatement, and containing thereturn false;within anelseifafter the closing braces of theifstatementsEDIT:
There are much, much better ways of doing this, but without changing what you’ve already got too much, try the above.