any way to avoid user enter tags (click o key on input)?
Opened this issue · 2 comments
I wanna know if exist a way to avoid the user enter a tag, i have a preloaded tags, and onclick they change their color (for filtering) ,but onclick the input activates, and left edit (with keys, no with click) and enter tags
Solved
Custom Code
``
ed.click(function (e, closest_tag) {
var d, dist = 99999, loc;
// do not create tag when user selects tags by text selection
if (window.getSelection && getSelection() != '') return;
if (o.maxTags && ed.data('tags').length >= o.maxTags) { ed.find('input').blur(); return false; }
blur_result = true
$('input:focus', ed).blur();
if (!blur_result) return false;
blur_result = true
// always remove placeholder on click
$('.placeholder', ed).remove();
if (closest_tag && closest_tag.length)
loc = 'before';
else {
// calculate tag closest to click position
$('.tag-editor-tag', ed).each(function () {
var tag = $(this), to = tag.offset(), tag_x = to.left, tag_y = to.top;
if (e.pageY >= tag_y && e.pageY <= tag_y + tag.height()) {
if (e.pageX < tag_x) loc = 'before', d = tag_x - e.pageX;
else loc = 'after', d = e.pageX - tag_x - tag.width();
if (d < dist) dist = d, closest_tag = tag;
}
});
}
if (o.allowUserTags) {
if (loc == 'before') {
$(new_tag).insertBefore(closest_tag.closest('li')).find('.tag-editor-tag').click();
} else if (loc == 'after')
$(new_tag).insertAfter(closest_tag.closest('li')).find('.tag-editor-tag').click();
else // empty editor
$(new_tag).appendTo(ed).find('.tag-editor-tag').click();
}
else {
if (loc == "")
$(new_tag).appendTo(ed).find('.tag-editor-tag').click();
}
// return false; //codigo original no permite .click event, este si
return !(o.allowClickEvent);
});
``
``
$.fn.tagEditor.defaults = {
initialTags: [],
maxTags: 0,
maxLength: 50,
allowClickEvent: false, //allow .click events
allowUserTags: true, //allow (or deny) the click en tag-edit (for insert)
delimiter: ',;',
placeholder: '',
forceLowercase: true,
removeDuplicates: true,
clickDelete: false,
animateDelete: 175,
sortable: true, // jQuery UI sortable
autocomplete: null, // options dict for jQuery UI autocomplete
// callbacks
onChange: function () { },
beforeTagSave: function () { },
beforeTagDelete: function () { }
};
} (jQuery));
``
NOTE: if you create an empty tag-editor , on click (boot new option true) ,this will minimize (but dont let enter tags), like on picture
This is just what I needed, thanks for sharing