Form Basic

Example form

Help block.

Custom controls

Input group

Email
Large
Small

Mask

Define data-mask={your-mask-pattern} attribute to activate mask.


Define data-mask-date={date-pattern} attribute to activate date mask.

Compatible with moment.js. You can change settings in dataMaskDate() method in DomActionsHandler.js class

Sizing

Horizontal form

Gender
Newsletter

Column sizing

JS validation

Fine! Field is required.
Fine! Field is required.
Fine! Field is required and must be email.
Fine!
Gender *

HTML5 validation