JavaScript - Validate a form

by "Sara Winters" <saraw(at)fcs.net>

 Date:  Mon, 14 Aug 2000 14:39:23 -0700
 To:  "hwg languages" <hwg-languages(at)hwg.org>
  todo: View Thread, Original
Hi Everyone,

I am having trouble validating a form.  It is a shopping cart page, and all
of the the other fields (such as billing and shipping address) are working
fine, and alert the user if they forget to add a piece of information.
However, when the user adds their credit card information, the validation is
not working properly (it is the last step on the page).
An alert box does appear if the user forgets a piece of credit card info
when the user clicks the submit button.  But instead of returning false, and
allowing the user to enter the credit card information, the order is
submitted, and the user is taken to the next which displays their receipt.

The function to validate the credit card information is called next to the
"submit" button, and I am wondering if I should call this function earlier
in the form so the order will not submit until all of the info is entered.
Below are my functions and the submit button - any help would be greatly
appreciated.

Thank you!

Sara



function isGoodYear(y)
    {

  // Use this if you do not have access to the servers system date.
  // Get current year from client machine
  // myDate = new Date();
  // myYear = (myDate.getYear() + 1900);
  // myMonth = (myDate.getMonth()); // Remember that JavaScript getMonth
will return a number between 00 and 11
  // alert(myYear);

  // Get current year from server
  myYear = (:sYear);
  myMonth = (:sMonth);
  theirYear =
(document.forms[ 0 ].ccYear.options[document.forms[ 0 ].ccYear.selectedIndex
].value);

  // Find out if the year they gave is equal or greater or less than current
year
    if (theirYear > myYear)
        {
        return true;
        }
  else if (myYear > theirYear)
    {
        alert("Your credit card seems to have expired (You entered " +
theirYear + ". It is now " + myYear + ".)\nPlease enter a updated expiration
or try another credit card.");
        return false;
    }
  else
    {
        // it is equal, check the month.
    theirMonth =
(document.forms[ 0 ].ccMonth.options[document.forms[ 0 ].ccMonth.selectedInd
ex].value);
    if (myMonth > theirMonth)
      {
      alert("Your credit card seems to have expired\n(You entered " +
theirMonth + ", " + theirYear + ". It is now " + myMonth + ", " + myYear +
".)\nPlease enter a updated expiration or try another credit card.");
      return false;
      }
    }
  return true;
    }



function validateCreditCardNumber()
    {


  // Next check that the proper amount of numbers have been entered for the
credit card.
    if (document.forms[ 0 ].CreditCardNumber1.value.length != 4)
        {
        alert("The credit card number is not completely filled out");
        return false;
        }
    if (document.forms[ 0 ].CreditCardNumber2.value.length != 4)
        {
        alert("The credit card number is not completely filled out");
        return false;
        }
    if (document.forms[ 0 ].CreditCardNumber3.value.length != 4)
        {
        alert("The credit card number is not completely filled out");
        return false;
        }
    if (document.forms[ 0 ].CreditCardNumber4.value.length != 4)
        {
        alert("The credit card number is not completely filled out");
        return false;
        }

  // Next check that credit card entries were all numbers.
    if (isAllDigits(document.forms[ 0 ].CreditCardNumber1.value) == false)
        {
        alert("The credit card number contains invalid characters");
        return false;
        }
    if (isAllDigits(document.forms[ 0 ].CreditCardNumber2.value) == false)
        {
        alert("The credit card number contains invalid characters");
        return false;
        }
    if (isAllDigits(document.forms[ 0 ].CreditCardNumber3.value) == false)
        {
        alert("The credit card number contains invalid characters");
        return false;
        }
    if (isAllDigits(document.forms[ 0 ].CreditCardNumber4.value) == false)
        {
        alert("The credit card number contains invalid characters");
        return false;
        }



  // Check the card's expiration date.
    if (isGoodYear(document.forms[ 0 ].ccYear.value) == false)
        {
        return false;
        }

  // Next check that they filled out the Name-On-Card field.
    if (4 > document.forms[ 0 ].ccName.value.length)
        {
    alert("The \"Name On Card\" field does not appear to be filled out
properly.\nPlease enter a correct name and resubmit.");
        return false;
        }




  // Removed Credit Card Type-Check from Radio Buttons from here.

  // Check that the numbers pass the MOD10 test.
    var sum = sumForMod10(document.forms[ 0 ].CreditCardNumber1.value);
    sum += sumForMod10(document.forms[ 0 ].CreditCardNumber2.value);
    sum += sumForMod10(document.forms[ 0 ].CreditCardNumber3.value);
    sum += sumForMod10(document.forms[ 0 ].CreditCardNumber4.value);
    if (sum % 10 != 0)
        {
        alert("The credit card number does not appear to be valid.\nPlease
re-enter it.");
        return false;
        }

  // Check the card's expiration date.
    if (isGoodYear(document.forms[ 0 ].ccYear.value) == false)
        {
        return false;
        }

  // Check that they filled out the Name-On-Card field.
    if (4 > document.forms[ 0 ].ccName.value.length)
        {
    alert("The \"Name On Card\" field does not appear to be filled out
properly.\nPlease enter a correct name and resubmit.");
        return false;
        }
    file://return true;
}


------

This my submit button calling the functions:

<INPUT TYPE="submit" VALUE=" Continue Your Order " onClick="setTotals();
checkForm(); validateCreditCardNumber(); return false;">

HWG: hwg-languages mailing list archives, maintained by Webmasters @ IWA