Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Tagging plugin for jQuery
JavaScript
branch: master

This branch is 29 commits ahead, 10 commits behind rafudu:master

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
css
examples
README.markdown
jquery-1.3.2.js
jquery.tagbox.js

README.markdown

Tagbox

Tagbox is a simple tagging plugin for jQuery.

Usage

(Examples at: http://irae.pro.br/code/tagbox/examples/)

Download the plugin and include jquery.tagbox.js and tags.css in your page to get started.

The simplest way to use Tagbox is to put this code inside a script tag:

$('.tagbox').tagbox();

Tagbox can be applied to input / textarea fields. They will be converted to div's.

This way, when the user clicks on the .tagbox element, a new tag will be created to receive input. New tags are created automatically when user presses , or ','.

Parameters

  • classname:String. The html class name of the tag (default: 'tag')
  • name:String. The text field name (default: none)
  • separator:RegExp. Expression to split the text field text into new tags. (default: /[,]/ [comma])
  • grouping:String. Character to group tags (a separator don't create a new tag when placed inside a group). (default: none)

// Tags separated by space, grouped by double-quotes with custom input name and class. $('.tagbox').tagbox({ separator: /\s/, grouping: '"', className: 'recipients', name: 'recipients[]' });

Separators

You can customize the separator character. If you want space separated tags, just use:

$('.tagbox').tagbox({
    separator: /\s/
});

The separator parameter is a regular expression. We also support multiple separators, like:

$('.tagbox').tagbox({
    separator: /[,; ]/
});

This way, we are splitting tags by ',' , ';' and space.

Tag Groups

If you need tags grouped by quotes, just pass a string to the grouping parameter. Let's say you want space-separated tags, but grouped by quotes:

$('.tagbox').tagbox({
    separator: /\s/,
    grouping: '"'
}); 

Now you can have tags like "New York" and "Central Park".

Callbacks

We provide you the ability to hook custom events to the blur, onkeyup and onkeydown from the options. These events are hooked before the plugin's blur, keyup and keydown events.

Other uses

Use your creativity! Tagbox can be used in other kinds of user input, like contacts, product properties, etc.

Contact

http://raphamartins.com/contact

Something went wrong with that request. Please try again.