A library for managing tags.

How To Use It

  1. Add the required files to your web page <head>.

    <link href='hardtack.css' rel='stylesheet'/>
    <script src='hardtack.js'></script>
  2. Create an input element with the class ht-input.

    <input id='tag-editor' class='ht-input' type='text' />
  3. Initialize hardtack.

  4. Call the library to add or remove tags.

    ht.add('My Tag');
    ht.remove('My Tag');




Initialize hardtack by calling setup() using the When a new tag is created it is assigned the classes in the string tagClass.


By default hardtack creates tags with the classe ht-label. To add your your own class(es):

ht.setTagClass('my-class my-other-class');

Add Tag

Add tag with the string My Tag:

ht.add('My Tag');

Remove Tag

Remove tag with the string My Tag:

ht.remove('My Tag');

Remove All Tags



Add Tag

When the user types in the tag editor and hits Return, the tagAdded event fires.

Remove Tag

When the user clicks a tag to remove it, the tagRemoved event fires.

How To Get It

The project page is at https://seagrape.us/hardtack.html. Download the source code at https://seagrape.us/hardtack-2.0.zip.


MIT license.

Contact Me

Bug reports and patches can be sent to craig@seagrape.us.