https://github.com/mrtcode/tagbar
Tagbar component with an auto-suggester
https://github.com/mrtcode/tagbar
tagbar tags user-interface
Last synced: 3 months ago
JSON representation
Tagbar component with an auto-suggester
- Host: GitHub
- URL: https://github.com/mrtcode/tagbar
- Owner: mrtcode
- License: mit
- Created: 2017-02-21T21:06:44.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2017-02-24T11:58:00.000Z (almost 9 years ago)
- Last Synced: 2025-01-23T23:30:02.506Z (12 months ago)
- Topics: tagbar, tags, user-interface
- Language: JavaScript
- Homepage:
- Size: 16.6 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Tagbar
[Demo](https://mrtcode.github.io/tagbar/demo.html)
[](https://mrtcode.github.io/tagbar/demo.html)
Write tags
Insert/remove tags
* No dependencies
* Has an autosuggester
* Supports touch devices
## Usage
Download [Tagbar](https://github.com/mrtcode/tagbar/releases) and include `tagbar.js` and `tagbar.css` files on your page.
```
```
Alternatively, you can require it as a module if you use Browserify
```js
var tagbar = require('./tagbar.js');
```
Create a tagbar inside a container. Pass an element or element id as a container parameter.
```html
```
```js
var tagbar = new Tagbar({
container: 'container-id',
});
tagbar.setTags(['creative', 'holidays']);
var tags = tagbar.getTags();
```
Attach event handlers
```js
var tagbar = new Tagbar({
container: 'container-id',
onAdd: function (tag) {
console.log(tag);
},
onRemove: function (tag) {
console.log(tag);
},
onSuggest: function (query, callback) {
callback(['suggestion1', 'suggestion2', 'suggestion3']);
}
});
```