Add and remove items in any order without touching your mouse. Use
your left/right arrow keys to move the caret (ibeam) between items.
This example is instantiated from a <input type="text">
element (note that the value is represented as a string).
Email Contacts
This demonstrates two main things: (1) custom item and option
rendering, and (2) item creation on-the-fly. Try typing a valid and
invalid email address.
Single Item Select
The most vanilla of examples.
Option Groups
Selectize supports <optgroup> rendering (as of v0.5.0).
Max Items
This example only allows 3 items. Select one more item and the
control will be disabled until one or more are deleted.
Country Selector
A good example of (1) support for international characters
(diacritics) and (2) how items are scored and sorted. Try typing
"islands", for instance.
Remote Source — Github
This demo shows how to integrate third-party data from the GitHub
API.
Remote Source — Rotten Tomatoes
This demo shows how to integrate third-party data from the Rotten
Tomatoes API. Try searching for "Iron Man". Note:
if this doesn't work, it's because the API limit has been reached...
try again later :)
City / State Selection
A demonstration showing how to use the API to cascade controls for a
classic state / city selector. Note: The API for
fetching cities is a little spotty, so if it fails to list cities,
that's what's going on (try another state).
"restore_on_backspace"
Press the [backspace] key and go back to editing the item without it
being fully removed.
"remove_button"
This plugin adds classic a classic remove button to each item for
behavior that mimics Select2 and Chosen.
"drag_drop"
Adds drag-and-drop support for easily rearranging selected items.
Requires jQuery UI (sortable).
"optgroup_columns"
A plugin by Simon Hewitt that renders optgroups horizontally with convenient
left/right keyboard navigation.