Form validation with regex

• Validate data on a form using JavaScript regular expressions
• Use functions in JavaScript

This assignment involves validating form data. Although HTML5 has some validation built-in now, it is not fully suppoorted in all browsers, and this assignment requires you to use regular JavaScript functions and JavaScript regular expressions (not HTML5 validation) to do the validation.

• Create a web page with a nicely laid-out form containing fields for name, age, zipcode, telephone number, and password. Include reset and submit buttons. Use JavaScript functions to validate the form fields when the form is submitted. If the form validates, send the form data to http://kermit.kish.edu/~dklick/dataChecker.php. as a POST request. You should get a response that tells you if the data you sent is valid. Of course, your validation routine could still be incorrect if you haven't tested enough possibilities or your validation routine is excluding some correct answers from being sent.
• The names of the text input elements should be name, age, zip, phone, and pass. The exact names are important since that is what the receiving page will be expecting.
• Display form validation error messages either below the form or to the right of each input field.
• Display ALL error messages instead of stopping when the first error is encountered.
• All form fields should be required.
• The name field must be non-blank.
• The age field must be a valid integer between 16 and 120. To check for being an integer, create and use a JavaScript function [named something like isInteger()]. If it is a valid integer, then check the range of ages using regular if statements [eg. if (age >= 16)].
• The zipcode field should allow the following formats:
  • #########
  • #####
  • #####-####
  • ##### ####
• The password field must be:
  • between eight and sixteen characters long
  • contain at least one lowercase letter
  • contain at least one uppercase letter
  • contain at least one digit
  • contain at least one character in the set: ! " # $ % & ' ( ) * + , - . : ; < = > ? @ [ ] ^ _ ` { | } ~
  • and contain no characters other than those just mentioned as required
• If there are any validation errors, then display all of them and do not let the form be submitted.
• If there are no errors, then submit the form data as a POST request to: http://kermit.kish.edu/~dklick/dataChecker.php
• Error messages should be cleared if there are any changes to the text boxes or if the Clear button is clicked.

if (!pass) { err += "<p>Error: Password field is required.</p>"; } else if (!/^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!"#$%&'()*+,-.:;<=>?@[\]^_`{|}~])[-!"#$%&'()*+,.:;<=>?@[\]^_`{|}~0-9a-zA-Z]{8,16}$/.test(pass)) { err += "<p>Error: Password field value is not valid.</p>"; }

• 5 pts: The page has proper documentation comments and follows current standards.
• 5 pts: Name is properly validated.
• 6 pts: Age is properly validated.
• 9 pts: Zipcode is properly validated.
• 0 pts: Password is properly validated. [Code for this is included in assignment]
• 5 pts: The form is not submitted and all errors are displayed if there are any errors when submission is attempted.
• 5 pts: If there are no errors, the form data is submitted to the server page to check the data.
• 5 pts: Displayed error messages are cleared if there are any changes to input fields or if the Clear button is clicked.