Features:
form validation with html validation format
phone number and email address with Reg expression
passwords should be match with Javascript function to go through register processing
show up the message below according to the filling content
CODE Github
HTML
all the inputs are required. If empty, register won’t pass.
the pattern of the phone is a reg expression with a 10 number format.
the password pattern is from RegExr
the message display box changing with Javascript. default is “here”
CSS
center the form container
input has two kinds of pseudo conditions.And will be used when using form.checkValidity()
the event will return false if not valid.
button hovering styles and message center.
JAVASCRIPT
select DOM
When click submit,processFormData()
Then check the validate and store the data if validate
Set the isValidate is false because when first in the page nothing filled.
check the validate of form with checkValidility()
if not validate, give a error message and stop
if the passwords are not matched, give a message and stop. otherwise, different message
if the password is matched and also validated true, the register is processed.
After submitting the form, all the data should be stored in the database.
Grab all the values from the form.
👉Follow me for more useful web development content! love sharing🥰
