Themes: default legacy bootstrap2 bootstrap3
Fork me on GitHub

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.

It clocks in at around ~7kb (gzipped). The goal is to provide a solid & usable user-experience with a clean and powerful API.

It's a lot like Chosen, Select2, and Tags Input but with a few advantages. Developed by @brianreavis (partly at DIY). Licensed under the Apache License, Version 2.0… so do whatever you want with it!

Features

Tagging
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).

Find out more…