McGill & Hill Group
Powered by Quotion  v3.0.5 © 2018

Previous Page / Control Center Title

Tokenfield for Bootstrap Advanced tagging/tokenizing plugin
Basic usage
Advanced examples
Input sizing
Input group sizing
Validation states
Custom colors
Bootstrap Tags Input User interface for managing tags
Initialization
Default usage

Tags input is a simple and flexible extension with plenty of useful features and support of Twitter Typeahead library. To initialize tags input, you can use both javascript and data attributes.

Returned values
"Amsterdam,Washington,Sydney,Beijing"
Returned items
["Amsterdam","Washington","Sydney","Beijing"]
Using data attributes

Just add data-role="tagsinput" to your input field to automatically change it to a tags input field. Note: currently tags input supports only default options if intinalized via data attributes.

Returned values
Returned items
Basic options
Maximum tags allowed

When set, no more than the given number of tags are allowed to add (default: undefined). When maxTags is reached, a class 'bootstrap-tagsinput-max' is placed on the tagsinput element.

Returned values
"Amsterdam,Washington,Sydney"
Returned items
["Amsterdam","Washington","Sydney"]
Custom tags class

Tag element uses basic .label element markup and supports all color options available for it. Default color alternative is info, to use another color add proper class to tagClass option.

Returned values
"Amsterdam,Washington,Sydney"
Returned items
["Amsterdam","Washington","Sydney"]
Advanced examples
Tags input methods