Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/okcoker/taggle.js

📝 Form-ready dependency-less tagging.
https://github.com/okcoker/taggle.js

javascript micro standalone tagging taggle tags

Last synced: 2 months ago
JSON representation

📝 Form-ready dependency-less tagging.

Host: GitHub
URL: https://github.com/okcoker/taggle.js
Owner: okcoker
License: mit
Created: 2013-03-05T03:36:41.000Z (over 11 years ago)
Default Branch: master
Last Pushed: 2023-10-19T21:20:23.000Z (8 months ago)
Last Synced: 2024-03-24T20:02:56.434Z (3 months ago)
Topics: javascript, micro, standalone, tagging, taggle, tags
Language: JavaScript
Homepage: https://sean.is/poppin/tags
Size: 2.45 MB
Stars: 666
Watchers: 16
Forks: 119
Open Issues: 5
Metadata Files:
- Readme: README.md
- License: MIT-LICENSE.txt

Lists

awesome-stars - taggle.js - Form-ready dependency-less tagging. (JavaScript)

README

[![Build Status](https://travis-ci.org/okcoker/taggle.js.svg?branch=master)](https://travis-ci.org/okcoker/taggle.js) [![Coverage Status](https://img.shields.io/coveralls/okcoker/taggle.js.svg)](https://coveralls.io/r/okcoker/taggle.js)
=========

Form-ready dependency-less tagging.

## Install

Yarn:

yarn add taggle

NPM:

npm install taggle --save

Bower:

bower install taggle --save

## How it works

Taggle allows you to create tag fields within your forms, to allow for easy and optionally restricted, input from your users.

![](https://cloud.githubusercontent.com/assets/1030830/4432876/e5dbccd0-46b0-11e4-99cb-2578f4762256.gif)

Each tag contains an hidden input with a configurable name of `taggles[]` by default so when taggle is inserted in a form, your server can easily read each item and continue accordingly. Taggle is highly customizable with your own css, or you can optionally use the included assets to start your own project.

![](https://cloud.githubusercontent.com/assets/1030830/4432907/e001b336-46b2-11e4-966e-12b0648386c8.gif)

Taggle also contains a simple API for you to easily hook in to your favorite autocomplete libraries.

[How-To Demo](http://sean.is/poppin/tags/)

### CSS styling

[Minimal Styling Example](https://jsfiddle.net/okcoker/aqnspdtr/510/)

The project includes a starter CSS file as seen in the link above to get you started quickly with integrating things into your site. It is highly recommended that you customize this to the needs of your site. See the [example](https://github.com/okcoker/taggle.js/tree/master/example) folder for more styles.

## Support for older IE

Taggle comes with optional polyfills in order to add support for IE8 and IE9. If you want to support IE8, add the scripts on your page in this order:

### IE8 Support
- taggle-ie8.js
- taggle-ie9.js
- taggle.js

### IE9 Support
- taggle-ie9.js
- taggle.js

### Building minified version

After cloning the repo you can build minified versions of the library by:

- `yarn` OR `npm install`
- npm run build

## License