Documentation



Validation

This page shows off the validation for different fields. The two types of validation described are Bubble and Delegate. Delegate works by adding a "required" to a container and validating everything inside. Bubble works by adding a required to an element and validting it. The error styles will bubble up to its containers to show the error on the container. Using a combination of these two techniques you can create complex validation patterns.

If you open your browser console, you can run automated tests by clicking here.


Basic validation collection



Delegate
Bubble

Delegate
Bubble

Some generic
Some generic

New top validation collection

Top of the page validation allows the server to display errors at the top of a page and have them connected to the form. Documentation for this validation will be available in the documentation section soon.

My Message


Delegate
Bubble

Delegate
This is the most generic error
Bubble
This is the most generic error

Some generic
Some generic

Basic Field with Postcode validation (Custom Example)

This is the most generic error

Password box (Custom Example)

This is the most generic error


When to use

Used for password creation or where two fields need to be validated together