Skip to content

julianachagas/form-validation

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Form validation

Form validation in JavaScript using Regular Expressions.

The project contains a registration form the user can fill out to create an account, entering a username, email, and password. Each input is validated with regular expressions following a set of rules:

  • username: it must be between 5 - 15 characters long and contain only letters and numbers
  • email: it must be a valid address, e.g. [email protected] or [email protected]
  • password: it must contain letters, numbers, @, _ or -, and be between 8 - 20 characters long

The validation occurs as the user is typing into the input (a feedback message is shown to help the user) and also when the user submits the form.

Regular Expressions:

const patterns = {
  username: /^[a-z\d]{5,15}$/i,
  email: /^[a-z\d\.-]+@[a-z\d-]+\.[a-z]+(\.[a-z]+)?$/i,
  password: /^[\w@\-]{8,20}$/
};

Link:

Technologies

  • HTML
  • CSS
  • JavaScript

Concepts practiced

  • DOM manipulation
  • Regular Expressions (Regex)
  • Events: click, input, submit
  • .preventDefault() method
  • Array methods: forEach, every, push

Useful resources



Made with 💜 by Juliana Chagas