- 3
- 4
- 3

John Doe Junior administrator

## Advanced Forms

## Select Replacement

Basic select
Multi-Value Select
Placeholders
Minimum Input

## Multi-select

Basic Multi-select
Basic Multi-select (Only One)
With Preselected Options
Link button
With icon
Select All Option
With Search
Toggle All Button

## Tag Autocomplete

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.

## Toggle Switches

Large
Default
Small

## Slider Range

One Value

The current `value` is: 50

Range

The `min` is: 25 and the `max` is: 75

## Spinners

Default Spinner
Disabled
Horizontal buttons

with `max` value set to 10

Alternative

with `step` set to 5

## Masked Inputs

Input masks allows a user to more easily enter fixed width input where you would like them to enter the data in a certain format (dates,phones, etc).

Date
Phone
Product Key
SSN

## Date Picker

Default Datepicker
Date range
to
Multiple dates
Inline

## Time Pickers

Default Time Picker
24 Hour Mode Time Picker
Specify a step for the minute field

## Color Pickers

Default
RGBA
Horizontal
Component
Button
Select color

## MaxLength Control

Input

`max-length` set to 20.

Textarea

`max-length` set to 140.

## File Upload Drag'n Drop

## WYSIWYG Editors

Summernote

Start typing...

## Markdown Editor

Bootstrap Markdown
Start typing...