diff --git a/js/tag-it.js b/js/tag-it.js index 078c264f..d10dedd2 100644 --- a/js/tag-it.js +++ b/js/tag-it.js @@ -124,7 +124,7 @@ this.tagList = this.element.find('ul, ol').andSelf().last(); } - this.tagInput = $('').addClass('ui-widget-content'); + this.tagInput = $('').addClass('ui-widget-content'); if (this.options.readOnly) this.tagInput.attr('disabled', 'disabled'); @@ -200,7 +200,9 @@ var tags = node.val().split(this.options.singleFieldDelimiter); node.val(''); $.each(tags, function(index, tag) { - that.createTag(tag, null, true); + var val = tag.split(':')[0], + lbl = tag.split(':')[1]; + that.createTag(val, lbl, null, true); addedExistingFromSingleFieldNode = true; }); } else { @@ -214,8 +216,9 @@ if (!addedExistingFromSingleFieldNode) { this.tagList.children('li').each(function() { if (!$(this).hasClass('tagit-new')) { - that.createTag($(this).text(), $(this).attr('class'), true); - $(this).remove(); + var val = $(this).children('input:hidden').val().split(':')[0], + val = $(this).children('input:hidden').val().split(':')[1]; + that.createTag(val, lbl, $(this).attr('class'), true); } }); } @@ -268,25 +271,27 @@ // Autocomplete will create its own tag from a selection and close automatically. if (!(that.options.autocomplete.autoFocus && that.tagInput.data('autocomplete-open'))) { that.tagInput.autocomplete('close'); - that.createTag(that._cleanedInput()); - } + that.createTag(that._cleanedItemValue(), that._cleanedInput()); + } } }).blur(function(e){ - // Create a tag when the element loses focus. - // If autocomplete is enabled and suggestion was clicked, don't add it. - if (!that.tagInput.data('autocomplete-open')) { - that.createTag(that._cleanedInput()); - } + that.tagInput.autocomplete('close'); + $(this).val(''); }); // Autocomplete. if (this.options.availableTags || this.options.tagSource || this.options.autocomplete.source) { var autocompleteOptions = { - select: function(event, ui) { - that.createTag(ui.item.value); - // Preventing the tag input to be updated with the chosen value. - return false; - } + select: function( event, ui ) { + that.createTag(ui.item.value, ui.item.label); + // Preventing the tag input to be updated with the chosen value. + return false; + }, + focus: function ( event, ui ) { + $(this).val(ui.item.label); + $(this).data("item_value", ui.item.value); + return false; + } }; $.extend(autocompleteOptions, this.options.autocomplete); @@ -351,9 +356,15 @@ return this; }, - _cleanedInput: function() { - // Returns the contents of the tag input, cleaned and ready to be passed to createTag - return $.trim(this.tagInput.val().replace(/^"(.*)"$/, '$1')); + + _cleanedInput: function() { + // Returns the contents of the tag label, cleaned and ready to be passed to createTag + return $.trim(this.tagInput.val().replace(/^"(.*)"$/, '$1')); + }, + + _cleanedItemValue: function() { + // Returns the contents of the tag value, cleaned and ready to be passed to createTag + return this.tagInput.data("item_value"); }, _lastTag: function() { @@ -398,22 +409,37 @@ tagLabel: function(tag) { // Returns the tag's string label. - if (this.options.singleField) { return $(tag).find('.tagit-label:first').text(); - } else { - return $(tag).find('input:first').val(); - } + }, + + tagValue: function(tag) { + var that = this; + var lbl = that._formatStr(that.tagLabel(tag)); + var val = null; + if (this.options.singleField) { + values = $(this.options.singleFieldNode).val().split(this.options.singleFieldDelimiter); + $(values).each(function(i) { + var this_label = $.trim(this.split(':')[1]); + if (this_label == lbl){ + val = $.trim(this.split(':')[0]); + return false; + } + }); + } else { + val = $(tag).find('input:first').val().split(':')[0]; + } + return val; }, _showAutocomplete: function() { this.tagInput.autocomplete('search', ''); }, - _findTagByLabel: function(name) { + _findTagByValue: function(name) { var that = this; var tag = null; this._tags().each(function(i) { - if (that._formatStr(name) == that._formatStr(that.tagLabel(this))) { + if (that._formatStr(name) == that._formatStr(that.tagValue(this))) { tag = $(this); return false; } @@ -422,7 +448,7 @@ }, _isNew: function(name) { - return !this._findTagByLabel(name); + return !this._findTagByValue(name); }, _formatStr: function(str) { @@ -436,7 +462,7 @@ return Boolean($.effects && ($.effects[name] || ($.effects.effect && $.effects.effect[name]))); }, - createTag: function(value, additionalClass, duringInitialization) { + createTag: function(value, tagLabel, additionalClass, duringInitialization) { var that = this; value = $.trim(value); @@ -450,7 +476,7 @@ } if (!this.options.allowDuplicates && !this._isNew(value)) { - var existingTag = this._findTagByLabel(value); + var existingTag = this._findTagByValue(value); if (this._trigger('onTagExists', null, { existingTag: existingTag, duringInitialization: duringInitialization @@ -467,7 +493,7 @@ return false; } - var label = $(this.options.onTagClicked ? '' : '').text(value); + var label = $(this.options.onTagClicked ? '' : '').text(tagLabel); // Create tag. var tag = $('
  • ') @@ -495,7 +521,8 @@ // Unless options.singleField is set, each tag has a hidden input field inline. if (!this.options.singleField) { var escapedValue = label.html(); - tag.append(''); + var val_lbl = $.trim(value) + ':' + tagLabel; + tag.append(''); } if (this._trigger('beforeTagAdded', null, { @@ -508,7 +535,8 @@ if (this.options.singleField) { var tags = this.assignedTags(); - tags.push(value); + var val_lbl = $.trim(value) + ':' + tagLabel; + tags.push(val_lbl); this._updateSingleTagsField(tags); } @@ -544,12 +572,13 @@ } if (this.options.singleField) { - var tags = this.assignedTags(); - var removedTagLabel = this.tagLabel(tag); - tags = $.grep(tags, function(el){ - return el != removedTagLabel; - }); - this._updateSingleTagsField(tags); + var tags = this.assignedTags(); + var removedTagLabel = this.tagLabel(tag); + tags = $.grep(tags, function(elem){ + var el = elem.split(':')[1]; + return el != removedTagLabel; + }); + this._updateSingleTagsField(tags); } if (animate) { diff --git a/js/tag-it.min.js b/js/tag-it.min.js index fd6140c8..ba034e03 100644 --- a/js/tag-it.min.js +++ b/js/tag-it.min.js @@ -1,17 +1 @@ -(function(b){b.widget("ui.tagit",{options:{allowDuplicates:!1,caseSensitive:!0,fieldName:"tags",placeholderText:null,readOnly:!1,removeConfirmation:!1,tagLimit:null,availableTags:[],autocomplete:{},showAutocompleteOnFocus:!1,allowSpaces:!1,singleField:!1,singleFieldDelimiter:",",singleFieldNode:null,animate:!0,tabIndex:null,beforeTagAdded:null,afterTagAdded:null,beforeTagRemoved:null,afterTagRemoved:null,onTagClicked:null,onTagLimitExceeded:null,onTagAdded:null,onTagRemoved:null,tagSource:null},_create:function(){var a= -this;this.element.is("input")?(this.tagList=b("").insertAfter(this.element),this.options.singleField=!0,this.options.singleFieldNode=this.element,this.element.addClass("tagit-hidden-field")):this.tagList=this.element.find("ul, ol").andSelf().last();this.tagInput=b('').addClass("ui-widget-content");this.options.readOnly&&this.tagInput.attr("disabled","disabled");this.options.tabIndex&&this.tagInput.attr("tabindex",this.options.tabIndex);this.options.placeholderText&&this.tagInput.attr("placeholder", -this.options.placeholderText);this.options.autocomplete.source||(this.options.autocomplete.source=function(a,e){var d=a.term.toLowerCase(),c=b.grep(this.options.availableTags,function(a){return 0===a.toLowerCase().indexOf(d)});this.options.allowDuplicates||(c=this._subtractArray(c,this.assignedTags()));e(c)});this.options.showAutocompleteOnFocus&&(this.tagInput.focus(function(b,d){a._showAutocomplete()}),"undefined"===typeof this.options.autocomplete.minLength&&(this.options.autocomplete.minLength= -0));b.isFunction(this.options.autocomplete.source)&&(this.options.autocomplete.source=b.proxy(this.options.autocomplete.source,this));b.isFunction(this.options.tagSource)&&(this.options.tagSource=b.proxy(this.options.tagSource,this));this.tagList.addClass("tagit").addClass("ui-widget ui-widget-content ui-corner-all").append(b('
  • ').append(this.tagInput)).click(function(d){var c=b(d.target);c.hasClass("tagit-label")?(c=c.closest(".tagit-choice"),c.hasClass("removed")||a._trigger("onTagClicked", -d,{tag:c,tagLabel:a.tagLabel(c)})):a.tagInput.focus()});var c=!1;if(this.options.singleField)if(this.options.singleFieldNode){var d=b(this.options.singleFieldNode),f=d.val().split(this.options.singleFieldDelimiter);d.val("");b.each(f,function(b,d){a.createTag(d,null,!0);c=!0})}else this.options.singleFieldNode=b(''),this.tagList.after(this.options.singleFieldNode);c||this.tagList.children("li").each(function(){b(this).hasClass("tagit-new")|| -(a.createTag(b(this).text(),b(this).attr("class"),!0),b(this).remove())});this.tagInput.keydown(function(c){if(c.which==b.ui.keyCode.BACKSPACE&&""===a.tagInput.val()){var d=a._lastTag();!a.options.removeConfirmation||d.hasClass("remove")?a.removeTag(d):a.options.removeConfirmation&&d.addClass("remove ui-state-highlight")}else a.options.removeConfirmation&&a._lastTag().removeClass("remove ui-state-highlight");if(c.which===b.ui.keyCode.COMMA&&!1===c.shiftKey||c.which===b.ui.keyCode.ENTER||c.which== -b.ui.keyCode.TAB&&""!==a.tagInput.val()||c.which==b.ui.keyCode.SPACE&&!0!==a.options.allowSpaces&&('"'!=b.trim(a.tagInput.val()).replace(/^s*/,"").charAt(0)||'"'==b.trim(a.tagInput.val()).charAt(0)&&'"'==b.trim(a.tagInput.val()).charAt(b.trim(a.tagInput.val()).length-1)&&0!==b.trim(a.tagInput.val()).length-1))c.which===b.ui.keyCode.ENTER&&""===a.tagInput.val()||c.preventDefault(),a.options.autocomplete.autoFocus&&a.tagInput.data("autocomplete-open")||(a.tagInput.autocomplete("close"),a.createTag(a._cleanedInput()))}).blur(function(b){a.tagInput.data("autocomplete-open")|| -a.createTag(a._cleanedInput())});if(this.options.availableTags||this.options.tagSource||this.options.autocomplete.source)d={select:function(b,c){a.createTag(c.item.value);return!1}},b.extend(d,this.options.autocomplete),d.source=this.options.tagSource||d.source,this.tagInput.autocomplete(d).bind("autocompleteopen.tagit",function(b,c){a.tagInput.data("autocomplete-open",!0)}).bind("autocompleteclose.tagit",function(b,c){a.tagInput.data("autocomplete-open",!1)}),this.tagInput.autocomplete("widget").addClass("tagit-autocomplete")}, -destroy:function(){b.Widget.prototype.destroy.call(this);this.element.unbind(".tagit");this.tagList.unbind(".tagit");this.tagInput.removeData("autocomplete-open");this.tagList.removeClass("tagit ui-widget ui-widget-content ui-corner-all tagit-hidden-field");this.element.is("input")?(this.element.removeClass("tagit-hidden-field"),this.tagList.remove()):(this.element.children("li").each(function(){b(this).hasClass("tagit-new")?b(this).remove():(b(this).removeClass("tagit-choice ui-widget-content ui-state-default ui-state-highlight ui-corner-all remove tagit-choice-editable tagit-choice-read-only"), -b(this).text(b(this).children(".tagit-label").text()))}),this.singleFieldNode&&this.singleFieldNode.remove());return this},_cleanedInput:function(){return b.trim(this.tagInput.val().replace(/^"(.*)"$/,"$1"))},_lastTag:function(){return this.tagList.find(".tagit-choice:last:not(.removed)")},_tags:function(){return this.tagList.find(".tagit-choice:not(.removed)")},assignedTags:function(){var a=this,c=[];this.options.singleField?(c=b(this.options.singleFieldNode).val().split(this.options.singleFieldDelimiter), -""===c[0]&&(c=[])):this._tags().each(function(){c.push(a.tagLabel(this))});return c},_updateSingleTagsField:function(a){b(this.options.singleFieldNode).val(a.join(this.options.singleFieldDelimiter)).trigger("change")},_subtractArray:function(a,c){for(var d=[],f=0;f=this.options.tagLimit)return this._trigger("onTagLimitExceeded",null,{duringInitialization:d}),!1;var g=b(this.options.onTagClicked?'':'').text(a),e=b("
  • ").addClass("tagit-choice ui-widget-content ui-state-default ui-corner-all").addClass(c).append(g); -this.options.readOnly?e.addClass("tagit-choice-read-only"):(e.addClass("tagit-choice-editable"),c=b("").addClass("ui-icon ui-icon-close"),c=b('\u00d7').addClass("tagit-close").append(c).click(function(a){f.removeTag(e)}),e.append(c));this.options.singleField||(g=g.html(),e.append(''));!1!==this._trigger("beforeTagAdded",null,{tag:e,tagLabel:this.tagLabel(e), -duringInitialization:d})&&(this.options.singleField&&(g=this.assignedTags(),g.push(a),this._updateSingleTagsField(g)),this._trigger("onTagAdded",null,e),this.tagInput.val(""),this.tagInput.parent().before(e),this._trigger("afterTagAdded",null,{tag:e,tagLabel:this.tagLabel(e),duringInitialization:d}),this.options.showAutocompleteOnFocus&&!d&&setTimeout(function(){f._showAutocomplete()},0))},removeTag:function(a,c){c="undefined"===typeof c?this.options.animate:c;a=b(a);this._trigger("onTagRemoved", -null,a);if(!1!==this._trigger("beforeTagRemoved",null,{tag:a,tagLabel:this.tagLabel(a)})){if(this.options.singleField){var d=this.assignedTags(),f=this.tagLabel(a),d=b.grep(d,function(a){return a!=f});this._updateSingleTagsField(d)}if(c){a.addClass("removed");var d=this._effectExists("blind")?["blind",{direction:"horizontal"},"fast"]:["fast"],g=this;d.push(function(){a.remove();g._trigger("afterTagRemoved",null,{tag:a,tagLabel:g.tagLabel(a)})});a.fadeOut("fast").hide.apply(a,d).dequeue()}else a.remove(), -this._trigger("afterTagRemoved",null,{tag:a,tagLabel:this.tagLabel(a)})}},removeTagByLabel:function(a,b){var d=this._findTagByLabel(a);if(!d)throw"No such tag exists with the name '"+a+"'";this.removeTag(d,b)},removeAll:function(){var a=this;this._tags().each(function(b,d){a.removeTag(d,!1)})}})})(jQuery); +!function(t){t.widget("ui.tagit",{options:{allowDuplicates:!1,caseSensitive:!0,fieldName:"tags",placeholderText:null,readOnly:!1,removeConfirmation:!1,tagLimit:null,availableTags:[],autocomplete:{},showAutocompleteOnFocus:!1,allowSpaces:!1,singleField:!1,singleFieldDelimiter:",",singleFieldNode:null,animate:!0,tabIndex:null,beforeTagAdded:null,afterTagAdded:null,beforeTagRemoved:null,afterTagRemoved:null,onTagClicked:null,onTagLimitExceeded:null,onTagAdded:null,onTagRemoved:null,tagSource:null},_create:function(){var e=this;this.element.is("input")?(this.tagList=t("").insertAfter(this.element),this.options.singleField=!0,this.options.singleFieldNode=this.element,this.element.addClass("tagit-hidden-field")):this.tagList=this.element.find("ul, ol").andSelf().last(),this.tagInput=t('').addClass("ui-widget-content"),this.options.readOnly&&this.tagInput.attr("disabled","disabled"),this.options.tabIndex&&this.tagInput.attr("tabindex",this.options.tabIndex),this.options.placeholderText&&this.tagInput.attr("placeholder",this.options.placeholderText),this.options.autocomplete.source||(this.options.autocomplete.source=function(e,i){var a=e.term.toLowerCase(),s=t.grep(this.options.availableTags,function(t){return 0===t.toLowerCase().indexOf(a)});this.options.allowDuplicates||(s=this._subtractArray(s,this.assignedTags())),i(s)}),this.options.showAutocompleteOnFocus&&(this.tagInput.focus(function(){e._showAutocomplete()}),"undefined"==typeof this.options.autocomplete.minLength&&(this.options.autocomplete.minLength=0)),t.isFunction(this.options.autocomplete.source)&&(this.options.autocomplete.source=t.proxy(this.options.autocomplete.source,this)),t.isFunction(this.options.tagSource)&&(this.options.tagSource=t.proxy(this.options.tagSource,this)),this.tagList.addClass("tagit").addClass("ui-widget ui-widget-content ui-corner-all").append(t('
  • ').append(this.tagInput)).click(function(i){var a=t(i.target);if(a.hasClass("tagit-label")){var s=a.closest(".tagit-choice");s.hasClass("removed")||e._trigger("onTagClicked",i,{tag:s,tagLabel:e.tagLabel(s)})}else e.tagInput.focus()});var i=!1;if(this.options.singleField)if(this.options.singleFieldNode){var a=t(this.options.singleFieldNode),s=a.val().split(this.options.singleFieldDelimiter);a.val(""),t.each(s,function(t,a){var s=a.split(":")[0],n=a.split(":")[1];e.createTag(s,n,null,!0),i=!0})}else this.options.singleFieldNode=t(''),this.tagList.after(this.options.singleFieldNode);if(i||this.tagList.children("li").each(function(){if(!t(this).hasClass("tagit-new")){var i=t(this).children("input:hidden").val().split(":")[0],i=t(this).children("input:hidden").val().split(":")[1];e.createTag(i,lbl,t(this).attr("class"),!0)}}),this.tagInput.keydown(function(i){if(i.which==t.ui.keyCode.BACKSPACE&&""===e.tagInput.val()){var a=e._lastTag();!e.options.removeConfirmation||a.hasClass("remove")?e.removeTag(a):e.options.removeConfirmation&&a.addClass("remove ui-state-highlight")}else e.options.removeConfirmation&&e._lastTag().removeClass("remove ui-state-highlight");(i.which===t.ui.keyCode.COMMA&&i.shiftKey===!1||i.which===t.ui.keyCode.ENTER||i.which==t.ui.keyCode.TAB&&""!==e.tagInput.val()||i.which==t.ui.keyCode.SPACE&&e.options.allowSpaces!==!0&&('"'!=t.trim(e.tagInput.val()).replace(/^s*/,"").charAt(0)||'"'==t.trim(e.tagInput.val()).charAt(0)&&'"'==t.trim(e.tagInput.val()).charAt(t.trim(e.tagInput.val()).length-1)&&t.trim(e.tagInput.val()).length-1!==0))&&((i.which!==t.ui.keyCode.ENTER||""!==e.tagInput.val())&&i.preventDefault(),e.options.autocomplete.autoFocus&&e.tagInput.data("autocomplete-open")||(e.tagInput.autocomplete("close"),e.createTag(e._cleanedItemValue(),e._cleanedInput())))}).blur(function(){e.tagInput.autocomplete("close"),t(this).val("")}),this.options.availableTags||this.options.tagSource||this.options.autocomplete.source){var n={select:function(t,i){return e.createTag(i.item.value,i.item.label),!1},focus:function(e,i){return t(this).val(i.item.label),t(this).data("item_value",i.item.value),!1}};t.extend(n,this.options.autocomplete),n.source=this.options.tagSource||n.source,this.tagInput.autocomplete(n).bind("autocompleteopen.tagit",function(){e.tagInput.data("autocomplete-open",!0)}).bind("autocompleteclose.tagit",function(){e.tagInput.data("autocomplete-open",!1)}),this.tagInput.autocomplete("widget").addClass("tagit-autocomplete")}},destroy:function(){return t.Widget.prototype.destroy.call(this),this.element.unbind(".tagit"),this.tagList.unbind(".tagit"),this.tagInput.removeData("autocomplete-open"),this.tagList.removeClass(["tagit","ui-widget","ui-widget-content","ui-corner-all","tagit-hidden-field"].join(" ")),this.element.is("input")?(this.element.removeClass("tagit-hidden-field"),this.tagList.remove()):(this.element.children("li").each(function(){t(this).hasClass("tagit-new")?t(this).remove():(t(this).removeClass(["tagit-choice","ui-widget-content","ui-state-default","ui-state-highlight","ui-corner-all","remove","tagit-choice-editable","tagit-choice-read-only"].join(" ")),t(this).text(t(this).children(".tagit-label").text()))}),this.singleFieldNode&&this.singleFieldNode.remove()),this},_cleanedInput:function(){return t.trim(this.tagInput.val().replace(/^"(.*)"$/,"$1"))},_cleanedItemValue:function(){return this.tagInput.data("item_value")},_lastTag:function(){return this.tagList.find(".tagit-choice:last:not(.removed)")},_tags:function(){return this.tagList.find(".tagit-choice:not(.removed)")},assignedTags:function(){var e=this,i=[];return this.options.singleField?(i=t(this.options.singleFieldNode).val().split(this.options.singleFieldDelimiter),""===i[0]&&(i=[])):this._tags().each(function(){i.push(e.tagLabel(this))}),i},_updateSingleTagsField:function(e){t(this.options.singleFieldNode).val(e.join(this.options.singleFieldDelimiter)).trigger("change")},_subtractArray:function(e,i){for(var a=[],s=0;s=this.options.tagLimit)return this._trigger("onTagLimitExceeded",null,{duringInitialization:s}),!1;var l=t(this.options.onTagClicked?'':'').text(i),u=t("
  • ").addClass("tagit-choice ui-widget-content ui-state-default ui-corner-all").addClass(a).append(l);if(this.options.readOnly)u.addClass("tagit-choice-read-only");else{u.addClass("tagit-choice-editable");var r=t("").addClass("ui-icon ui-icon-close"),g=t('×').addClass("tagit-close").append(r).click(function(){n.removeTag(u)});u.append(g)}if(!this.options.singleField){var h=(l.html(),t.trim(e)+":"+i);u.append('')}if(this._trigger("beforeTagAdded",null,{tag:u,tagLabel:this.tagLabel(u),duringInitialization:s})!==!1){if(this.options.singleField){var d=this.assignedTags(),h=t.trim(e)+":"+i;d.push(h),this._updateSingleTagsField(d)}this._trigger("onTagAdded",null,u),this.tagInput.val(""),this.tagInput.parent().before(u),this._trigger("afterTagAdded",null,{tag:u,tagLabel:this.tagLabel(u),duringInitialization:s}),this.options.showAutocompleteOnFocus&&!s&&setTimeout(function(){n._showAutocomplete()},0)}},removeTag:function(e,i){if(i="undefined"==typeof i?this.options.animate:i,e=t(e),this._trigger("onTagRemoved",null,e),this._trigger("beforeTagRemoved",null,{tag:e,tagLabel:this.tagLabel(e)})!==!1){if(this.options.singleField){var a=this.assignedTags(),s=this.tagLabel(e);a=t.grep(a,function(t){var e=t.split(":")[1];return e!=s}),this._updateSingleTagsField(a)}if(i){e.addClass("removed");var n=this._effectExists("blind")?["blind",{direction:"horizontal"},"fast"]:["fast"],o=this;n.push(function(){e.remove(),o._trigger("afterTagRemoved",null,{tag:e,tagLabel:o.tagLabel(e)})}),e.fadeOut("fast").hide.apply(e,n).dequeue()}else e.remove(),this._trigger("afterTagRemoved",null,{tag:e,tagLabel:this.tagLabel(e)})}},removeTagByLabel:function(t,e){var i=this._findTagByLabel(t);if(!i)throw"No such tag exists with the name '"+t+"'";this.removeTag(i,e)},removeAll:function(){var t=this;this._tags().each(function(e,i){t.removeTag(i,!1)})}})}(jQuery);