/bootstrap-tag

A javascript plugin for Twitter Bootstrap 2.x that makes it easy to create simple, beautiful tag inputs.

Primary LanguageCSS

Tags for Twitter Bootstrap 2.x

bootstrap-tag is a javascript plugin that makes it easy to create simple, beautiful tag inputs with the help of Twitter Bootstrap.

Usage

Just like in Bootstrap you can activate it without any JavaScript, just by adding a data-attribute, you can make it automatically work.

Simply add data-provide="tag". You can set options via data-attributes, too.

<input class="input-tag" type="text" name="tags" data-provide="tag">

Alternatively, you can initialize via JavaScript:

$('.input-tag').tag(options);

Options

  • caseInsensitive (optional) Whether or not search and matching should be case insensitive. Default to true.
  • allowDuplicates (optional) Whether or not to allow duplicate tags. Defaults to false.
  • source (optional) The data source to query against. May be an array of strings or a function. Defaults to [].
  • autocompleteOnComma (optional) Autocomplete on comma type with the first suggested value (if any). Default to false. Thank you, knightq!

Events

  • added Triggered immediately after a tag is successfully added. The event handler will be passed the value that was added.
  • removed Triggered immediately after a tag is successfully removed. The event handler will be passed the value that was removed.

Example

You can try it here. I've also included the example in the docs folder.