GoConqr has a new look! Let us know what you think.

13. JS Forms

Module 1 · Media Course's Objectives
Module 2 · Media Forms
Module 3 · Media Reset and Submit
Module 4 · Media Input Attributes
Module 5 · Media Validate a basic form
Module 6 · Media Checkvalidity
Module 7 · Media Invalid Event You are here
Module 8 · Media Validity
Module 9 · Media Custom error messages
Module 10 · Media Form Pseudos
Module 11 · Media Validate the cv App
Module 12 · Media Validating string
Module 13 · Media Regex
Module 14 · Media The telephone number pattern
Module 15 · Media Literal
Module 16 · Media Alternatives Regex
Module 17 · Media Alternatives and optionals
Module 18 · Media The Mohammed's Name problem
Module 19 · Media Metacharacters
Module 20 · Media Character Sets
Module 21 · Media Quantifiers
Module 22 · Media Full name regex problem
Module 23 · Media Validate Password pattern
Module 24 · Media Validate German cellphone number
Module 25 · Media Validate email address
Module 26 · Media Check Valid Url address
Module 27 · Media Boundary
Module 28 · Media Who loves bears?
Module 29 · Media Match
Module 30 · Media Modifiers
Module 31 · Media Facebook vs Twitter
Module 32 · Media The Pattern attribute
Module 33 · Media Form Attributes

Close the course

Module 7 of 33 · Media

Invalid Event

Kostas Diakogiannis

The invalid event

The invalid event is a unique event to html DOM form input fields. It is triggered any time the checkValidity() functions returns a false boolean value (see a slide below). Inside this event we can specify and define a set of actions that are going to happen any time a field contains an invalid data.

Thus we can use the setCustomValidity() function to create a custom useful error message to the user and avoid giving him the standard default message from browser (preventDefault() is necessary to avoid this before doing anything further).

Invalid Event

13. JS Forms

Instructions

Feedback

What do you think of the new look?