jquery.taglist by jeffrafter

Simple tag list editor that converts the tags to blocks as you type

Example

Dependencies

JQuery 1.4+

Basic Usage

   <div class="container">
      <input id="taglist" name="taglist" class="taglist" 
        value="JavaScript jQuery tags editor" style="display:none" />
   </div> 
 
   <script type="text/javascript">
     options = {};
     tags = []
     $('input.taglist').taglist(tags, options)
   </script>

Advanced Usage

If you want to have long tags (with spaces) you can simply set the keyCodes and delimiter options to be empty and jquery.taglist will insert a JSON version of the tags into the value:

  $('input.taglist').taglist([], {keyCodes: null, delimiter: null})

Example

Additionally, jquery.taglist has several callbacks for you to handle things how you want:

  $('input.taglist').taglist([], {
    onAdd: function(tag) {},
    onRemove: function(tag) {},
    onProcess: function(tag) {}
  })

The process callback is useful for implementing validation or custom splitting logic. If included, the default processor (which adds the tag) will not be called. So be sure to call this.addTag(tag).

License

MIT License, http://www.opensource.org/licenses/mit-license.php

Authors

Jeff Rafter (jeff@socialrange.org)

Download

You can download this project in either zip or tar formats.

You can also clone the project with Git by running:

$ git clone git://github.com/jeffrafter/jquery.taglist