class SAPO.Component.Tags 
 requires SAPO.Dom.Css
 requires SAPO.Dom.Event
 requires in TagsFactory autocomplete SAPO.Component.Autocomplete
This component displays a set of tags. It enforces all tags to be different strings. Optionally orders them alphabetically and enforces lower case input. Tags must be added programatically addTag(tagName), which is easy by binding this method to a button's onclick event or input's keydown event. See the samples for usage examples.
Authors:
jose.p.dias AT co.sapo.pt
Version:
0.1
Since:
April 2011
Defined in Component/Tags/0.1/lib.js

Constructor Summary
Tags (String|DomElement elem, Object options)

Function Summary
TagsFactory (String recipe, Object options)
addTag (String tagName)
- adds a new tag to the component
String[] getTags()
- returns an array with the currently set tags
String getTagsAsString ([String separator])
- returns tags as a string. Useful for populating a form prior to submiting.
removeTag (String tagName, [Boolean showConfirmation])
- removes tag from component if found
removeTags()
- removes all tags from widget. calls callbacks but doesn't display delete confirmations
setTagList (String[] list)
- replaces previous tagList and updates UI

Constructor Details

constructor Tags

Tags(String|DomElement elem, Object options)
Parameters:
elem - block element which will be populated with the component
options
  • [ String cssURI ] - URI to alternate CSS file for styling the component (or same CSS but from a different domain)
  • [ String[] tagList ] - list of initial tags populated on the component
  • [ Boolean sortTagList ] - set true if you want the tags to be alphabetically ordered
  • [ Boolean forceLowerCase ] - set true to make all new tags be made of lowercase characters
  • [ Boolean confirmDeletion ] - if true, on deletion a confirmation dialog appears
  • [ String confirmationMessage ] - message which appears on the confirmation dialog. override for the client language as needed.
  • [ Function(String tagName) onTagAdded ] - callback which is called when tags are added to the component (on init too)
  • [ Function(String tagName) onTagDeleted ] - callback which is called when tags are removed from the component
  • [ Function(String tagName) onTagAddedLow ] - callback which is called when tags are added to the component (on init too)
  • [ Function(String tagName) onTagDeletedLow ] - callback which is called when tags are removed from the component

Function Details

function TagsFactory

TagsFactory(String recipe, Object options)
Parameters:
recipe ["free", "select", "autocomplete"]
options
  • [ String[] tagList ] same os Tags option
  • [ String[] possibleTagsList ] used in "select" recipe
  • [ String inputI ]
  • [ String autoCompleteCssURI ]
  • [ String autoCompleteRequestVar ] (default is 'text')
  • [ String autoCompleteResponseKey ] (default is 'suggestions')

function addTag

addTag(String tagName)
- adds a new tag to the component
Parameters:
tagName - Empty string or string already listed as a tag is silently ignored.

function getTags

String[] getTags()
- returns an array with the currently set tags

function getTagsAsString

String getTagsAsString([String separator])
- returns tags as a string. Useful for populating a form prior to submiting.
Parameters:
[separator] character(s) to use as separators between tags. Defaults to comma (',')
Returns:
a string representation of the tags

function removeTag

removeTag(String tagName, [Boolean showConfirmation])
- removes tag from component if found
Parameters:
tagName tag name to delete. if tag not found does nothing.
[showConfirmation] by default doesn't prompt user with a confirmation dialog if called explicitly

function removeTags

removeTags()
- removes all tags from widget. calls callbacks but doesn't display delete confirmations

function setTagList

setTagList(String[] list)
- replaces previous tagList and updates UI
Parameters:
list of tags
Search: