Project 2 Build off Project 1 and Create JavaScript/HTML5 Form Validation Solution

Description

Building off of Project 1:

Add client side HTML5 and JavaScript form validation for user input Validation Rules for Registration Fields:

• 1. User Name

• 1. 1. Required Field

• 1. 2. Max length 50 characters, minimum length 6 characters

• 2. Password

• 1. 1. Required Field

• 1. 2. Max length 50 characters, minimum length 8 characters

• 1. 3. Enforce 1 capital, 1 lowercase, 1 digit, 1 special character

• 3. Repeat Password

• 1. 1. Required Field

• 1. 2. Max length 50 characters, minimum length 8 characters

• 1. 3. Enforce 1 capital, 1 lowercase, 1 digit, 1 special character

• 1. 4. Ensure password fields match

• 4. First Name

• 1. 1. Required Field

• 1. 2. Max length 50 characters

• 5. Last Name

• 1. 1. Required Field

• 1. 2. Max length 50 characters

• 6. Address line 1

• 1. 1. Required Field

• 1. 2. Max length 100 characters

• 7. Address line 2

• 1. 1. Optional Field

• 1. 2. Max length 100 characters

• 8. City

• 1. 1. Required Field

• 1. 2. Max length 50 characters

• 9. State

• 1. 1. Required Field

• 1. 2. Max length 52 characters

• 10. Zip Code

• 1. 1. Required Field

• 1. 2. Max length 10 characters, minimum length 5 digits

• 1. 3. Dynamically adjust user input to match either xxxxx or xxxxx-xxxx format

• 11. Phone Number

• 1. 1. Required Field

• 1. 2. Max length 12 characters

• 1. 3. Use jQuery/JavaScript to dynamically adjust user input to match xxx-xxx-xxxx format

• 12. Email

• 1. 1. Required Field

CMP SCI 3010 Project 2 – Build off Project 1 and Create JavaScript/HTML5 Form Validation

• 1. 2. Email format, x@x.x format, where x is a placeholder for valid characters

• 13. Gender

• 13. 1. Required Field

• 13. 2. Max length 50 characters

• 13. Marital Status

• 13. 1. Required Field

• 13. 2. Max length 50 characters

• 13. Date of Birth

• 13. 1. Required Field

• 13. 2. MM/dd/yyyy format

• 13. Submit Button

• 13. 1. Submits valid user data only

• 13. Reset Button

• 13. 1. Resets all fields to default value (empty, for most fields) When validating user input with JavaScript. Check all user input fields.

15. All valid user inputs are marked green with some icon or messaging indicating good input.

• 15. All invalid user inputs are marked red with some icon or messaging indicating bad input. Follow coding standards http://www.w3schools.com/html/html5_syntax.asp