jquery.token-field

jquery plugin to deal with tokenized input (ie. tags or email addresses)

Forked by nextdude...

I forked this to add some functionality to support searching for tokens across multiple fields, as is done in the Mac OS X Lion Finder's folder search input field.

Usage

Copy javascript, stylesheet and images to your project.

Include javascript and stylesheets in your html.

 <script src="/javascripts/jquery.js" type="text/javascript"></script>
 <script src="/javascripts/jquery.token-field.js" type="text/javascript"></script>
 <link rel="stylesheet" href="/stylesheets/token-field.css" type="text/css" media="screen">

Add textarea or input[type=text] to your html with comma-delimited values.

 <textarea class='email'>one@domain.com,two@other.net,three@somewhere.ca</textarea>

Invoke the plugin in your document ready handler.

 $(document).ready(function() {
   $('textarea.email').tokenField();
 });

Options

badToken

A callback function to implement behaviour when an token is invalid.

Default: clear the invalid token

delimiters

A string containing the characters to recognize as delimiters for tokens.

Default: ', ' (ie. comma and/or space)

max

The maximum number of values to allow.

Default: 0 (unlimited)

nested

Set to true to preserve the legacy behaviour of token values being stored in multiple hidden input elements with the same name.

Set to false to store token values in a single hidden input element with a comma-delimited value.

Default: false (single, comma-delimited value)

regex

An alternate regular expression for validating values.

Default: /^[A-Z0-9._%+-]+@[A-Z0-9.-]+.[A-Z]{2,4}$/i (email address)

tooMany

A callback function to implement behaviour when the number of tokens exceeds the maximum (if provided).