Skip to content

Instantly share code, notes, and snippets.

@patrickleet
Last active February 27, 2016 17:22
Show Gist options
  • Save patrickleet/e1c7a05eca86f536e3d4 to your computer and use it in GitHub Desktop.
Save patrickleet/e1c7a05eca86f536e3d4 to your computer and use it in GitHub Desktop.
<!-- Context should be the object you are tagging -->
<template name="tagInput">
<select class='tag-input' name='tags[]' multiple="multiple">
{{#each tags}}
<option value="{{this}}" selected="true">{{this}}</option>
{{/each}}
</select>
</template>
Template.tagInput.rendered = function () {
var that = this;
this.$('.tag-input').selectize({
valueField: 'name',
labelField: 'name',
searchField: ['name'],
create: function(input, cb) {
console.log('create tag: ', input)
Items.addTag(input, {_id: that.data._id});
var tag = Meteor.tags.findOne({collection: 'items', name: input});
if (cb) {
cb(tag);
}
return tag;
},
options: Meteor.tags.find({collection: 'items'}).fetch(),
render: {
item: function(item, escape) {
return '<div>' +
(item.name ? '<span class="name">' + escape(item.name) + '</span>' : '') +
'</div>';
},
option: function(item, escape) {
var name = item.name;
var caption = item.nRefs;
return '<div>' +
'<span class="name">' + escape(name) + '</span>&nbsp;' +
(caption ? '<span class="badge">' + escape(caption) + '</span>' : '') +
'</div>';
}
},
onItemAdd: function(value, $item) {
console.log('add tag: ', value);
Items.addTag(value, {_id: that.data._id});
},
onItemRemove: function(value) {
console.log('remove tag: ', value);
Items.removeTag(value, {_id: that.data._id});
}
});
};
<!-- Context is object with 'tags' property -->
<template name='tags'>
<div class='tags'>
{{#each tags}}
<span class="label label-tag">{{this}}</span>
{{/each}}
</div>
</template>
@dandv
Copy link

dandv commented Dec 2, 2014

This would make for a nice Meteorpad.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment