Forms

Form with all types of fields

Please enter a valid value

Please enter a valid value

Please enter a valid password

Please enter a valid number

Please check this box

Toggle Invalid value.

Options selector




Please make a valid selection

Invalid value.

Options selector multiple select




Please make a valid selection

-




Invalid value.

Form (with columns layout and mixed with other content)

Heading in first column

Please enter a valid value

Please enter a valid value

Just some text added between form fields. Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.

Please enter a valid number

/files/demo/images/rosmarin 153657 Url

Some image added as free content

Please enter a valid number

Toggle Invalid value.

Heading in second column

Options selector




Please make a valid selection

Invalid value.

Options selector multiple select




Please make a valid selection

-




Invalid value.

Above this text you can see the captcha and button in a nested columns layout, such that the button is shown to the right of the captcha - provided there is enough space to show it there.

Text field

You can show a text field with any number of rows

Please enter a valid value

Please enter a valid value

Please enter a valid value

Fields for special data

Enter a valid e-mail address - or leave the field empty

Enter a valid url starting with http:// or https:// - or leave the field empty

Enter a valid phone number - or leave the field empty

Password field

Please enter a valid password

Number field

Please enter a valid number

Checkbox and toggle

Checkbox

Please check this box

Please check this box

Please check this box

Toggle

Label Invalid value.

Only label Invalid value.

Invalid value.

Options selector

Options selector (radio buttons)

Options selector where option can also be unchecked




Please make a valid selection

Options selector with empty option





Please make a valid selection

Options selector where selection is required




Invalid value.

Options selector with default selection




Invalid value.

Options selector drop-down (select list)

Invalid value.

Invalid value.

Invalid value.

Options selector multiple select (checkboxes)

Options selector multiple select




Please make a valid selection

Options selector multiple select




Please make a valid selection

Options selector multiple select




Please make a valid selection

Options selector multiple select drop-down (checkboxes in drop-down)

-




Invalid value.

-




Invalid value.

-




Invalid value.

Form (label is always to the left)

Please enter a valid value

Please enter a valid value

Please enter a valid number

Please enter a valid number

Please check this box

Toggle Invalid value.

Options selector




Please make a valid selection

Invalid value.

Options selector multiple select




Please make a valid selection

-




Invalid value.