displaying too many error messages at one time to fields I added

I am having a terrible time adding extra form fields to the contact form and applying the validations to my new fields to display error messages correctly. Here is a link to the uploaded contact form: contact.php

For client side spry validations, all the new fields I added display multiple error messages. How do I make it only display the pertinent error message onblur here instead of mulitple error messages on each of the fields that I added?

For server side validations only the phone number text field displays error messages wrong. There are two possible error messages on the phone number text field; one that says "A value is required." if nothing was entered, and a second one that says "Invalid format, please re-enter your phone number." The problem is that if nothing is entered, both error messages appear when the form is submitted; the second message about invalid format should not appear in this case. How do I make it only display the first error message and not the invalid format message, if they have simply neglected to enter anything at all here?

<?php
if ($_SERVER["REQUEST_METHOD"] == "POST") {
$WAFV_Redirect = "";
$_SESSION['WAVT_contact_Errors'] = "";
if ($WAFV_Redirect == "") {
$WAFV_Redirect = $_SERVER["PHP_SELF"];
}
$WAFV_Errors = "";
$WAFV_Errors .= WAValidateRQ(((isset($_POST["Contact_Name"]))?$_POST["Contact_Name"]:"") . "",true,1);
$WAFV_Errors .= WAValidateEM(((isset($_POST["Email_address"]))?$_POST["Email_address"]:"") . "",true,2);
$WAFV_Errors .= WAValidateRQ(((isset($_POST["Comments"]))?$_POST["Comments"]:"") . "",true,3);
$WAFV_Errors .= WAValidateLE(((isset($_POST["Security_code"]))?strtolower($_POST["Security_code"]):"") . "",((isset($_SESSION["captcha_1"]))?strtolower($_SESSION["captcha_1"]):"") . "",true,4);
$WAFV_Errors .= WAValidateLE(((isset($_POST["Security_question"]))?strtolower($_POST["Security_question"]):"") . "",((isset($_SESSION["random_answer"]))?strtolower($_SESSION["random_answer"]):"") . "",true,5);
$WAFV_Errors .= WAValidateRX(((isset($_POST["addblock"]))?$_POST["addblock"]:"") . "","/^$/i",false,6);
$WAFV_Errors .= WAValidateRX(((isset($_POST["seconddblock"]))?$_POST["seconddblock"]:"") . "","/^$/i",false,7);
$WAFV_Errors .= WAValidateRQ(((isset($_POST["company_name"]))?$_POST["company_name"]:"") . "",false,8);
$WAFV_Errors .= WAValidateRQ(((isset($_POST["address"]))?$_POST["address"]:"") . "",false,9);
$WAFV_Errors .= WAValidateRQ(((isset($_POST["city"]))?$_POST["city"]:"") . "",false,10);
$WAFV_Errors .= WAValidateRQ(((isset($_POST["zip"]))?$_POST["zip"]:"") . "",false,11);
$WAFV_Errors .= WAValidateRQ(((isset($_POST["phone"]))?$_POST["phone"]:"") . "",true,12);
$WAFV_Errors .= WAValidatePN(((isset($_POST["phone"]))?$_POST["phone"]:"") . "",true,false,true,13);

if ($WAFV_Errors != "") {
PostResult($WAFV_Redirect,$WAFV_Errors,"contact");
}
}
?>

This is just the code for the fields I added to the contact form which are giving me the difficulties I described in the previous post:

<label for="company_name">Company Name</label><br />
<span id="sprytextfield5">
<input name="company_name" type="text" id="company_name" onblur="if (document.getElementById('companyServerError')) document.getElementById('companyNameServerError').style.display='none'" value="<?php echo(ValidatedField("contact","company_name")) ?>" />
<span class="textfieldRequiredMsg">A value is required.</span>
</span>
<?php
if (ValidatedField("contact","contact")) {
if ((strpos((",".ValidatedField("contact","contact").","), "," . "8" . ",") !== false || "8" == "")) {
if (!(false)) {
?>
<span id="companyServerError" class="textfieldServerError">Please provide your company name.</span>
<?php //WAFV_Conditional contact.php contact(8: )
}
}
}?>

<br />
<label for="address">Address</label><br />
<span id="sprytextfield6">
<input name="address" type="text" id="address" onblur="if (document.getElementById('addressServerError')) document.getElementById('addressNameServerError').style.display='none'" value="<?php echo(ValidatedField("contact","address")) ?>" />
<span class="textfieldRequiredMsg">A value is required.</span>
</span>
<?php
if (ValidatedField("contact","contact")) {
if ((strpos((",".ValidatedField("contact","contact").","), "," . "9" . ",") !== false || "9" == "")) {
if (!(false)) {
?>
<span id="addressServerError" class="textfieldServerError">Please provide your address.</span>
<?php //WAFV_Conditional contact.php contact(9: )
}
}
}?>

<br />
<label for="city">City</label><br />
<span id="sprytextfield7">
<input name="city" type="text" id="city" onblur="if (document.getElementById('cityServerError')) document.getElementById('cityNameServerError').style.display='none'" value="<?php echo(ValidatedField("contact","city")) ?>" />
<span class="textfieldRequiredMsg">A value is required.</span>
</span>
<?php
if (ValidatedField("contact","contact")) {
if ((strpos((",".ValidatedField("contact","contact").","), "," . "10" . ",") !== false || "10" == "")) {
if (!(false)) {
?>
<span id="cityServerError" class="textfieldServerError">Please provide your city.</span>
<?php //WAFV_Conditional contact.php contact(10: )
}
}
}?>

<br />
<label for="state">State</label><br />
<span id="sprytextfield8">
<input name="state" type="text" id="state" onblur="if (document.getElementById('stateServerError')) document.getElementById('stateNameServerError').style.display='none'" value="<?php echo(ValidatedField("contact","state")) ?>" />
<span class="textfieldRequiredMsg">A value is required.</span>
</span>
<?php
if (ValidatedField("contact","contact")) {
if ((strpos((",".ValidatedField("contact","contact").","), "," . "11" . ",") !== false || "11" == "")) {
if (!(false)) {
?>
<span id="stateServerError" class="textfieldServerError">Please provide your state.</span>
<?php //WAFV_Conditional contact.php contact(11: )
}
}
}?>


<br />
<label for="zip">Zip</label><br />
<span id="sprytextfield9">
<input name="zip" type="text" id="zip" onblur="if (document.getElementById('zipServerError')) document.getElementById('zipNameServerError').style.display='none'" value="<?php echo(ValidatedField("contact","zip")) ?>" />
<span class="textfieldRequiredMsg">A value is required.</span>
</span>
<?php
if (ValidatedField("contact","contact")) {
if ((strpos((",".ValidatedField("contact","contact").","), "," . "11" . ",") !== false || "11" == "")) {
if (!(false)) {
?>
<span id="zipServerError" class="textfieldServerError">Please provide your zip code.</span>
<?php //WAFV_Conditional contact.php contact(11: )
}
}
}?>


<br />
<label for="phone">Phone Number</label><br />
<span id="sprytextfield10">
<input name="phone" type="text" id="phone" onblur="if (document.getElementById('phoneServerError')) document.getElementById('phoneNameServerError').style.display='none'" value="<?php echo(ValidatedField("contact","phone")) ?>" />
<span class="textfieldRequiredMsg">A value is required.</span>
</span>
<?php
if (ValidatedField("contact","contact")) {
if ((strpos((",".ValidatedField("contact","contact").","), "," . "12" . ",") !== false || "12" == "")) {
if (!(false)) {
?>
<span id="phoneServerError" class="textfieldServerError">Please provide your phone number.</span>
<?php //WAFV_Conditional contact.php contact(12: )
}
}
}?>
<?php
if (ValidatedField("contact","contact")) {
if ((strpos((",".ValidatedField("contact","contact").","), "," . "13" . ",") !== false || "13" == "")) {
if (!(false)) {
?>
<span id="phoneServerError" class="textfieldServerError">Invalid format, please re-enter your phone number.</span>
<?php //WAFV_Conditional contact.php contact(13: )
}
}
}?>


<script type="text/javascript">
<!--
var sprytextfield1 = new Spry.Widget.ValidationTextField("sprytextfield1", "none", {validateOn:["blur"]});
var sprytextfield2 = new Spry.Widget.ValidationTextField("sprytextfield2", "email", {validateOn:["blur"]});
var sprytextarea1 = new Spry.Widget.ValidationTextarea("sprytextarea1", {validateOn:["blur"]});
var sprytextfield3 = new Spry.Widget.ValidationTextField("sprytextfield3", "none", {validateOn:["blur"], minChars:<?php echo $WAGLOBAL_Captcha_Characters; ?>, maxChars:<?php echo $WAGLOBAL_Captcha_Characters; ?>});
var sprytextfield4 = new Spry.Widget.ValidationTextField("sprytextfield4", "none", {validateOn:["blur"]});
var sprytextfield5 = new Spry.Widget.ValidationTextField("sprytextfield5", "none", {validateOn:["blur"]});
var sprytextfield6 = new Spry.Widget.ValidationTextField("sprytextfield6", "none", {validateOn:["blur"]});
var sprytextfield7 = new Spry.Widget.ValidationTextField("sprytextfield7", "none", {validateOn:["blur"]});
var sprytextfield8 = new Spry.Widget.ValidationTextField("sprytextfield8", "none", {validateOn:["blur"]});
var sprytextfield9 = new Spry.Widget.ValidationTextField("sprytextfield9", "none", {validateOn:["blur"]});
var sprytextfield10 = new Spry.Widget.ValidationTextField("sprytextfield10", "none", {validateOn:["blur"]});
//-->
</script>

The problem is not in the code you provided.

There is a delicate balance of server and client validation that takes place on the page. It is kind of tricky to add to it if you don't understand exactly how it works, so I'll try to describe.

1) I see there is an issue with your spry validation. Normally you wouldn't be able to submit at all with the spry errors on the page. You can submit and that brings the server errors into play. Normally with spry server validaiton is only used if someone turns javascript off.

Most likely if you fixed that, these other problems would never occur... but I'll explain more for giggles.

Spry creates a span around your form field and creates specifically named span tags intside it for the error message. Spry will only show one error per field and the code and sytax is entirely determined by the spry library.

Server Validation is used to validate CAPTCHA and obvious question fields as well as adding further honeypot validation for bots. Technically speaking the "double up" you refer to could only potentially happen on those two fields.

Server validation has more flexability. It defines the validation rules in the code you provide above. The last argument, numbered 1 to 13 in your case becomes the reference for that particular error. You can then hide or show anything you want on your page based on the success or failure of these validations.

Now, if you fail server validation and an error message is shown, then there is code added onBlur that actually removes that server validation before the Spry validation is shown. This is the step you are probably missing that is causing the repeated fields. The repeats aren't actually from spry or from server validations... they are both showing at once... at least that is how it appears to me.

Oh... I guess I should have mentioned.. just remove the: onsubmit=""

from your form tag and it will fix the spry validation and most likely the rest of your problems.

I tried removing onsubmit="" from the form, but still multiple error messages. I'm a little confused...if the onsubmit="" is not there, how will it ever be sent?

well, it does work now. I guess my browser cache just needed to be refreshed. I used the form and everything seemed to work right, I think. and it sent the email. I just don't understand what's going on here, but I'm happy it's working :) thanks!

but I did want the validation toolkit server behaviors to come into play if the user does have javascript turned off. will those work correctly and show the right error messages if one or another field is not filled in?

Yes it should. The problem was that you had both showing... which would probably still happen if you turned off javascript, submitted the form, then turned it back on.

The reality is that the problem is fixable... by making sure to remove server errors onblur and we actually account for it in the code, but it is kind of overkill and not something you have to worry too much about since realistically it isn't going to happen very often if ever.

Originally Said By: Ray Borduin

  Yes it should. The problem was that you had both showing... which would probably still happen if you turned off javascript, submitted the form, then turned it back on.

The reality is that the problem is fixable... by making sure to remove server errors onblur and we actually account for it in the code, but it is kind of overkill and not something you have to worry too much about since realistically it isn't going to happen very often if ever.  

Curious...when you say "...by making sure to remove server errors onblur and we actually account for it in the code..." which lines of code in the original out-of-the-box contactus.php form are you referring to?

please forgive me, but could I ask one more question...

Is it ok for me ALWAYS remove the onsubmit="" in the form when I create these contact forms this way to get it to work right or is this just the easiest fix, but not necessarily the best practice for regular usage?