Form Advanced

Selectize

Selectize is the hybrid of a textbox and <select> box. It's jQuery-based and it's useful for tagging, contact lists, country selectors, and so on.

Awesome
Admin
Dashboard

Nothing
Wyoming
awesome
neat
yeah
"awesome"×
"neat"×
JavaScript

Switchery

iOS 7 style switches for your checkboxes

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

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

Select2

The jQuery replacement for select boxes

Single Select

Select2 can take a regular select box like this...

Multiple Select

Select2 can take a regular select box like this...

Bootstrap MaxLength

Uses the HTML5 attribute "maxlength" to work.

The badge will show up by default when the remaining chars are 10 or less:

Do you want the badge to show up when there are 20 chars or less? Use the threshold option:

Please note: if the alwaysShow option is enabled, the threshold option is ignored.

All you need to do is specify the placement option, with one of those strings. If none is specified, the positioning will be defauted to 'bottom'.

Bootstrap maxlength supports textarea as well as inputs. Even on old IE.

Multiple Select

Example of multiple select.

Default

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

  • Dallas Cowboys
  • New York Giants
  • Chicago Bears
  • Detroit Lions
  • Green Bay Packers
  • Minnesota Vikings
  • Carolina Panthers
  • New Orleans Saints
  • Tampa Bay Buccaneers
  • Arizona Cardinals
  • St. Louis Rams
  • San Francisco 49ers
  • Seattle Seahawks
  • Philadelphia Eagles
  • Washington Redskins
  • Atlanta Falcons
Grouped Options

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

    • NFC EAST
    • Dallas Cowboys
    • New York Giants
    • Philadelphia Eagles
    • Washington Redskins
    • NFC NORTH
    • Chicago Bears
    • Detroit Lions
    • Green Bay Packers
    • Minnesota Vikings
    • NFC SOUTH
    • Atlanta Falcons
    • Carolina Panthers
    • New Orleans Saints
    • Tampa Bay Buccaneers
    • NFC WEST
    • Arizona Cardinals
    • St. Louis Rams
    • San Francisco 49ers
    • Seattle Seahawks
Searchable

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

Bootstrap Touchspin

A mobile and touch friendly input spinner component for Bootstrap. Specify attribute data-toggle="touchspin" and your input would be conveterted into touch friendly spinner.

%
$
A ButtonA Button
Select a language...