A basic plugin for quickly creating elegant tag inputs with any form text input.
<input type="text" name="tags" data-provide="tag">
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">
Call a tag input with id myInput with a single line of JavaScript:
$('#myInput').tag(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. |
Initializes an input with tags.
A few events are available for hooking into tag functionality.
| Event | Description |
|---|---|
| added | This event is fired immediately after a tag has been successfully added. The event handler will be passed the value that was added. |
| removed | This event is fired immediately after a tag has been successfully removed. The event handler will be passed the value that was removed. |
$('#myTag').on('added', function (e, value) {
// do something...
})