Example

A basic plugin for quickly creating elegant tag inputs with any form text input.

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

Usage

Via data attributes

Activate a modal without writing JavaScript. Set data-provides="tag" on a text input element and it'll be converted into a tag input.

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

Via JavaScript

Call a tag input with id myInput with a single line of JavaScript:

$('#myInput').tag(options)

Options

Options can be passed via data attributes or JavaScript. For data attributes, append the option name to data-, as in data-caseInsensitive="true".

Name Type Default Description
caseInsensitive boolean true Case insensitive search
allowDuplicates boolean false Allows duplicates
source array, function [] The data source to query against. May be an array of strings or a function. The function is passed two arguments, the query value in the input field and the process callback. The function may be used synchronously by returning the data source directly or asynchronously via the process callback's single argument.

Methods

.tag(options)

Initializes an input with tags.