explaingit

selectize/selectize.js

★ 13,027SCSSAudience · developerComplexity · 2/5LicenseSetup · easy

TLDR

Selectize is a jQuery UI control that replaces plain HTML dropdowns with a searchable, taggable input where users can pick from a list or create new entries, with Bootstrap themes and a plugin API.

Mindmap

mindmap
  root((selectize.js))
    What it does
      Searchable dropdown
      Tagging input
      Remote data loading
    Features
      Ranked search
      Keyboard navigation
      Touch support
    Styling
      Bootstrap 2 to 5 themes
      Sass and Less source
    Tech stack
      JavaScript jQuery
      npm package
      Plugin API
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Replace a plain HTML select element with a searchable, keyboard-navigable dropdown that ranks results as the user types.

USE CASE 2

Build a tagging input where users can pick existing tags or type to create new ones on the fly.

USE CASE 3

Add a contact or country picker that loads options from a server API as the user types.

USE CASE 4

Style the control with a pre-built Bootstrap 5 theme or customize it further using Sass source files.

Tech stack

JavaScriptjQuerySCSSLessnpm

Getting it running

Difficulty · easy Time to first run · 30min

jQuery must be installed separately as a required peer dependency.

Use freely in any project, including commercially, as long as you include the license and copyright notice.

In plain English

Selectize is a JavaScript UI control that combines a plain text input with a dropdown selector. Built on top of jQuery, it lets users pick items from a list while also being able to type, search, and create new entries on the fly. Common uses include tagging systems, contact pickers, and country selectors on web forms. The control includes a few practical features beyond what a standard HTML select element offers. Search is scored and ranked in real time so that the most relevant options float to the top as the user types. Keyboard navigation works the way most people expect: arrow keys move between selected items, and holding a modifier key lets you select multiple entries at once to delete them in one go. It also handles international characters, supports touch devices, and can fetch options from a server as the user types, which is useful when the full list is too large to load upfront. Styling comes with themes that match Bootstrap versions 2 through 5, and the source files are available in both Sass and Less for projects that need further customization. The default theme is a single CSS file included in the pre-built distribution folder. Installation is done through npm with the package name @selectize/selectize, or by manually copying the compiled files from the dist folder into a project. jQuery is a required dependency that must be installed separately. A plugin API built on microplugin is available for adding custom behavior without modifying the core code. The project is maintained by a community team and is licensed under the Apache License 2.0. As of the README, the team was actively looking for additional contributors to help with ongoing maintenance.

Copy-paste prompts

Prompt 1
Add a Selectize tag input to my HTML form that lets users pick from a predefined list or create new tags.
Prompt 2
Configure Selectize to load autocomplete suggestions from a REST API endpoint as the user types, with a debounce delay.
Prompt 3
Apply the Bootstrap 5 Selectize theme to a dropdown and override the highlight color using Sass variables.
Prompt 4
Write a Selectize plugin using the microplugin API that limits the maximum number of selected items to three.
Open on GitHub → Explain another repo

← selectize on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.