Learn how to validate a whole form

The above code is basically our old number-checking function but without the JavaScript alerts. In this case, we don't automatically send an error message if the user enters something other than a numeral.

Once the user thinks she's finished with the form, she can hit the Submit button. At that point, we check for any fields that have missing or incorrectly formatted data.

function validateForm() {
  var fixThis = "";
  if
(!(isANumber(document.orderForm.numberOrdered.value))) {
    fixThis += "Please enter a numeric value
for the number of brains field.\n";
  }
  if
(!(exists(document.orderForm.typeField.value))) {
    fixThis += "Please enter the type.\n";
  }
  if
(!(exists(document.orderForm.stateField.value))) {
    fixThis += "Please enter the state.\n";
  }
  if
(!(isAPhoneNumber(document.orderForm.phoneNumber.value))) {
    fixThis += "Please enter the phone number
in the following format: (123)456-7890";
  }
  if
(fixThis != "") {
    alert(fixThis);
  } else {
    document.location.href = "thanks.html";
  }
}

This function works its way through all the fields in the form, checking to make sure each one contains a valid value. If it finds a field without valid data, it adds a new warning message to the fixThis variable and continues on. At the end, it either pops up an alert box containing the various warnings, or it delivers a short "Thank You" to the user.

Note: This example checks the code for a part of the form we haven't covered yet--the State box, which computes sales tax based on the U.S state code the user enters.