Preventing bad form information is a deadly game of cat and also cat.
Then, by taking advantage of its API and the CSS hooks, we were able to build a powerful solution for custom validations — including server-side validations via AJAX, and provide immediate feedback to the user, with error messages in any language supported.
Although there are a few Java Script based solutions, none of them are a fit in to what we needed.
Also, developing on the top of someone else’s solution can easily turn into a painful job.
Ideally, users fill in the form with necessary information and finish the job successfully. These requirements turned into the main characteristics of this solution: element (type=email, number, …), we also have constraint validation (required, maxlength, …) to ease the work of checking the form content on the client side.
Constraint validation is an algorithm browsers run natively when a form is submitted to determine its validity.
These allow us to easily have valid/invalid fields changing its appearance, helping the user identify the errors and correct them right away.