Advanced Form Elements

Timepicker
Colorpicker
Date Picker
Date Range Picker
Switchery
Basic

Add an attribute data-plugin="switchery" data-color="@colors" to your input element and it will be converted into switch.

Sizes & Secondary color

Add an attribute data-size="small",data-size="large", data-color="@color" data-secondary-color="@color" to your input element and it will be converted into switch.

Tags Input
Input Tags

Just add data-role="tagsinput" to your input field to automatically change it to a tags input field.

True multi value

Use a <select multiple /> as your input element for a tags input, to gain true multivalue support. Instead of a comma separated string, the values will be set in an array. Existing <option /> elements will automatically be set as tags. This makes it also possible to create tags containing a comma.

Multiple Select
Default

Use a <select multiple /> as your input element for a tags input, to gain true multivalue support.

Grouped Options

Use a <select multiple /> as your input element for a tags input, to gain true multivalue support.

Searchable

Use a <select multiple /> as your input element for a tags input, to gain true multivalue support.

Select2
Select2 With Search box
Multiple Select2 items
Limiting the number of selections
Input Masks
e.g "999-99-999-9999-9"
999 99 999 9999 9
999/99/999/9999/9
192.168.110.310
4deg:1340:6547:2:540:h8je:ve73:98pd
99-9999999
(999) 999-9999
$ 999,999,999.99
dd/mm/yyyy
dd-mm-yyyy
Bootstrap TouchSpin
Bootstrap MaxLength