Minimalist Tags Input Plugin with jQuery and Bootstrap - tags.js

A simplest jQuery plugin which converts a standard text input into a tagging widget styled with Twitter's Bootstrap 3. 

Features:

• Type something in the text field and press the enter key to add a new tag.
• Click on the tag label to edit the tag.

How to use it:

1. Load the Bootstrap's stylesheet file in the head section of the document.

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">

2. Load the jQuery.tags.js script after jQuery JavaScript library.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="dist/jquery.tags.min.js"></script>

3. Adding the data-toggle="tags" attribute to your text input will auto initialize the plugin on document ready.

<input type="text" data-toggle="tags" />

4. Or initialize the plugin by calling the $('#id').tags() method on your text input.

$('#id').tags('tag1', 'tag2');

5. You can get the value your user input using $('#id').val()

$('#value').text($('#id').val());

6. Available options.

values: [] // initial values

Change log:

2015-07-09

• fixed bugs
• added several options.
• fixed style.

---

This awesome jQuery plugin is developed by QingWei-Li. For more Advanced Usages, please check the demo page or visit the official website.