mirror of
https://github.com/e107inc/e107.git
synced 2025-08-04 13:47:31 +02:00
Changed to bootstrap tags (instead of jquery-ui)
This commit is contained in:
Cameron
@@ -76,9 +76,11 @@ function loadJSAddons()
|
||||
|
||||
e107::js('core', 'password/jquery.pwdMeter.js', 'jquery', 2);
|
||||
|
||||
// e107::css('core', 'bootstrap-tag/bootstrap-tag.css', 'jquery');
|
||||
e107::js('core', 'bootstrap-tag/bootstrap-tag.js', 'jquery', 2);
|
||||
|
||||
e107::js("core", "tags/jquery.tagit.js","jquery",3);
|
||||
e107::css('core', 'tags/jquery.tagit.css', 'jquery');
|
||||
// e107::js("core", "tags/jquery.tagit.js","jquery",3);
|
||||
// e107::css('core', 'tags/jquery.tagit.css', 'jquery');
|
||||
|
||||
e107::css('core', 'core/admin.jquery.css', 'jquery');
|
||||
e107::js("core", "core/admin.jquery.js","jquery",4); // Load all default functions.
|
||||
|
||||
@@ -758,6 +758,28 @@ ul#e-latest { line-height:17px }
|
||||
ul#e-latest li a span.badge { float:right; }
|
||||
ul#e-latest li a:hover { text-decoration: none; }
|
||||
|
||||
/* Bootstrap tags */
|
||||
.tags {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.tag {
|
||||
margin-right:5px;
|
||||
display: inline-block;
|
||||
float: none;
|
||||
margin-left: 0;
|
||||
vertical-align:top;
|
||||
margin-top:3px;
|
||||
|
||||
}
|
||||
|
||||
span.tag button.close {
|
||||
float: none;
|
||||
padding-left:5px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*
|
||||
|
||||
body { background-color: rgb(68, 68, 68); }
|
||||
|
||||
193
e107_web/js/bootstrap-tag/bootstrap-tag.js
vendored
Normal file
193
e107_web/js/bootstrap-tag/bootstrap-tag.js
vendored
Normal file
@@ -0,0 +1,193 @@
|
||||
/* ==========================================================
|
||||
* bootstrap-tag.js v2.2.2
|
||||
* https://github.com/fdeschenes/bootstrap-tag
|
||||
* ==========================================================
|
||||
* Copyright 2012 Francois Deschenes.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
* ========================================================== */
|
||||
|
||||
// https://github.com/soliantconsulting/tagmanager/blob/master/tagmanager.js
|
||||
|
||||
!function ( $ ) {
|
||||
|
||||
'use strict' // jshint ;_;
|
||||
|
||||
var Tag = function ( element, options ) {
|
||||
this.element = $(element)
|
||||
this.options = $.extend(true, {}, $.fn.tag.defaults, options)
|
||||
this.values = $.grep($.map(this.element.val().split(','), $.trim), function ( value ) { return value.length > 0 })
|
||||
this.show()
|
||||
}
|
||||
|
||||
Tag.prototype = {
|
||||
constructor: Tag
|
||||
|
||||
, show: function () {
|
||||
var that = this
|
||||
|
||||
that.element.parent().prepend(that.element.detach().attr('type', 'hidden'))
|
||||
that.element
|
||||
.wrap($('<div class="tags">'))
|
||||
.parent()
|
||||
.on('click', function () {
|
||||
that.input.focus()
|
||||
})
|
||||
|
||||
if (that.values.length) {
|
||||
$.each(that.values, function () {
|
||||
that.createBadge(this)
|
||||
})
|
||||
}
|
||||
|
||||
that.input = $('<input type="text">')
|
||||
.attr('placeholder', that.options.placeholder)
|
||||
.insertAfter(that.element)
|
||||
.on('focus', function () {
|
||||
that.element.parent().addClass('tags-hover')
|
||||
})
|
||||
.on('blur', function () {
|
||||
that.process()
|
||||
that.element.parent().removeClass('tags-hover')
|
||||
that.element.siblings('.tag').removeClass('tag-important')
|
||||
})
|
||||
.on('keydown', function ( event ) {
|
||||
if ( event.keyCode == 188 || event.keyCode == 13 || event.keyCode == 9 ) {
|
||||
if ( $.trim($(this).val()) && ( !that.element.siblings('.typeahead').length || that.element.siblings('.typeahead').is(':hidden') ) ) {
|
||||
if ( event.keyCode != 9 ) event.preventDefault()
|
||||
that.process()
|
||||
} else if ( event.keyCode == 188 ) {
|
||||
if ( !that.element.siblings('.typeahead').length || that.element.siblings('.typeahead').is(':hidden') ) {
|
||||
event.preventDefault()
|
||||
} else {
|
||||
that.input.data('typeahead').select()
|
||||
event.stopPropagation()
|
||||
event.preventDefault()
|
||||
}
|
||||
}
|
||||
} else if ( !$.trim($(this).val()) && event.keyCode == 8 ) {
|
||||
var count = that.element.siblings('.tag').length
|
||||
if (count) {
|
||||
var tag = that.element.siblings('.tag:eq(' + (count - 1) + ')')
|
||||
if (tag.hasClass('tag-important')) that.remove(count - 1)
|
||||
else tag.addClass('tag-important')
|
||||
}
|
||||
} else {
|
||||
that.element.siblings('.tag').removeClass('tag-important')
|
||||
}
|
||||
})
|
||||
.typeahead({
|
||||
source: that.options.source
|
||||
, matcher: function ( value ) {
|
||||
return ~value.toLowerCase().indexOf(this.query.toLowerCase()) && (that.inValues(value) == -1 || that.options.allowDuplicates)
|
||||
}
|
||||
, updater: $.proxy(that.add, that)
|
||||
})
|
||||
}
|
||||
, inValues: function ( value ) {
|
||||
if (this.options.caseInsensitive) {
|
||||
var index = -1
|
||||
$.each(this.values, function (indexInArray, valueOfElement) {
|
||||
if ( valueOfElement.toLowerCase() == value.toLowerCase() ) {
|
||||
index = indexInArray
|
||||
return false
|
||||
}
|
||||
})
|
||||
return index
|
||||
} else {
|
||||
return $.inArray(value, this.values)
|
||||
}
|
||||
}
|
||||
, createBadge: function ( value ) {
|
||||
var that = this
|
||||
|
||||
$('<span class="tag label label-info ">')
|
||||
.text(value)
|
||||
.append($('<button type="button" class="close">×</button>')
|
||||
.on('click', function () {
|
||||
that.remove(that.element.siblings('.tag').index($(this).closest('.tag')))
|
||||
})
|
||||
)
|
||||
.insertBefore(that.element)
|
||||
}
|
||||
, add: function ( value ) {
|
||||
var that = this
|
||||
|
||||
if ( !that.options.allowDuplicates ) {
|
||||
var index = that.inValues(value)
|
||||
if ( index != -1 ) {
|
||||
var badge = that.element.siblings('.tag:eq(' + index + ')')
|
||||
badge.addClass('tag-warning')
|
||||
setTimeout(function () {
|
||||
$(badge).removeClass('tag-warning')
|
||||
}, 500)
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
this.values.push(value)
|
||||
this.createBadge(value)
|
||||
|
||||
this.element.val(this.values.join(', '))
|
||||
}
|
||||
, remove: function ( index ) {
|
||||
if ( index >= 0 ) {
|
||||
this.values.splice(index, 1)
|
||||
this.element.siblings('.tag:eq(' + index + ')').remove()
|
||||
this.element.val(this.values.join(', '))
|
||||
}
|
||||
}
|
||||
, process: function () {
|
||||
var values = $.grep($.map(this.input.val().split(','), $.trim), function ( value ) { return value.length > 0 }),
|
||||
that = this
|
||||
$.each(values, function() {
|
||||
that.add(this)
|
||||
})
|
||||
this.input.val('')
|
||||
}
|
||||
}
|
||||
|
||||
var old = $.fn.tag
|
||||
|
||||
$.fn.tag = function ( option ) {
|
||||
return this.each(function () {
|
||||
var that = $(this)
|
||||
, data = that.data('tag')
|
||||
, options = typeof option == 'object' && option
|
||||
if (!data) that.data('tag', (data = new Tag(this, options)))
|
||||
if (typeof option == 'string') data[option]()
|
||||
})
|
||||
}
|
||||
|
||||
$.fn.tag.defaults = {
|
||||
allowDuplicates: false
|
||||
, caseInsensitive: true
|
||||
, placeholder: ''
|
||||
, source: []
|
||||
}
|
||||
|
||||
$.fn.tag.Constructor = Tag
|
||||
|
||||
$.fn.tag.noConflict = function () {
|
||||
$.fn.tag = old
|
||||
return this
|
||||
}
|
||||
|
||||
$(window).on('load', function () {
|
||||
$('[data-provide="tag"]').each(function () {
|
||||
var that = $(this)
|
||||
if (that.data('tag')) return
|
||||
that.tag(that.data())
|
||||
})
|
||||
})
|
||||
}(window.jQuery)
|
||||
@@ -137,7 +137,7 @@ $(document).ready(function()
|
||||
|
||||
});
|
||||
|
||||
$(".e-tags").tagit();
|
||||
$(".e-tags").tag();
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -1,55 +0,0 @@
|
||||
ul.tagit {
|
||||
padding: 1px 5px;
|
||||
overflow: auto;
|
||||
margin-left: inherit; /* usually we don't want the regular ul margins. */
|
||||
margin-right: inherit;
|
||||
width:270px;
|
||||
}
|
||||
ul.tagit li {
|
||||
display: block;
|
||||
float: left;
|
||||
margin: 2px 5px 2px 0;
|
||||
}
|
||||
ul.tagit li.tagit-choice {
|
||||
padding: .2em 18px .2em .5em;
|
||||
position: relative;
|
||||
line-height: inherit;
|
||||
}
|
||||
ul.tagit li.tagit-new {
|
||||
padding: .25em 4px .25em 0;
|
||||
}
|
||||
|
||||
ul.tagit li.tagit-choice a.tagit-label {
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
}
|
||||
ul.tagit li.tagit-choice .tagit-close {
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
right: .1em;
|
||||
top: 50%;
|
||||
margin-top: -8px;
|
||||
}
|
||||
|
||||
/* used for some custom themes that don't need image icons */
|
||||
ul.tagit li.tagit-choice .tagit-close .text-icon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
ul.tagit li.tagit-choice input {
|
||||
display: block;
|
||||
float: left;
|
||||
margin: 2px 5px 2px 0;
|
||||
}
|
||||
ul.tagit input[type="text"] {
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
|
||||
border: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: inherit;
|
||||
background-color: inherit;
|
||||
outline: none;
|
||||
}
|
||||
@@ -1,394 +0,0 @@
|
||||
/*
|
||||
* jQuery UI Tag-it!
|
||||
*
|
||||
* @version v2.0 (06/2011)
|
||||
*
|
||||
* Copyright 2011, Levy Carneiro Jr.
|
||||
* Released under the MIT license.
|
||||
* http://aehlke.github.com/tag-it/LICENSE
|
||||
*
|
||||
* Homepage:
|
||||
* http://aehlke.github.com/tag-it/
|
||||
*
|
||||
* Authors:
|
||||
* Levy Carneiro Jr.
|
||||
* Martin Rehfeld
|
||||
* Tobias Schmidt
|
||||
* Skylar Challand
|
||||
* Alex Ehlke
|
||||
*
|
||||
* Maintainer:
|
||||
* Alex Ehlke - Twitter: @aehlke
|
||||
*
|
||||
* Dependencies:
|
||||
* jQuery v1.4+
|
||||
* jQuery UI v1.8+
|
||||
*/
|
||||
(function($) {
|
||||
|
||||
$.widget('ui.tagit', {
|
||||
options: {
|
||||
itemName : 'item',
|
||||
fieldName : 'tags',
|
||||
availableTags : [],
|
||||
tagSource : null,
|
||||
removeConfirmation: false,
|
||||
caseSensitive : true,
|
||||
placeholderText : null,
|
||||
|
||||
// When enabled, quotes are not neccesary
|
||||
// for inputting multi-word tags.
|
||||
allowSpaces: false,
|
||||
|
||||
// Whether to animate tag removals or not.
|
||||
animate: true,
|
||||
|
||||
// The below options are for using a single field instead of several
|
||||
// for our form values.
|
||||
//
|
||||
// When enabled, will use a single hidden field for the form,
|
||||
// rather than one per tag. It will delimit tags in the field
|
||||
// with singleFieldDelimiter.
|
||||
//
|
||||
// The easiest way to use singleField is to just instantiate tag-it
|
||||
// on an INPUT element, in which case singleField is automatically
|
||||
// set to true, and singleFieldNode is set to that element. This
|
||||
// way, you don't need to fiddle with these options.
|
||||
singleField: false,
|
||||
|
||||
singleFieldDelimiter: ',',
|
||||
|
||||
// Set this to an input DOM node to use an existing form field.
|
||||
// Any text in it will be erased on init. But it will be
|
||||
// populated with the text of tags as they are created,
|
||||
// delimited by singleFieldDelimiter.
|
||||
//
|
||||
// If this is not set, we create an input node for it,
|
||||
// with the name given in settings.fieldName,
|
||||
// ignoring settings.itemName.
|
||||
singleFieldNode: null,
|
||||
|
||||
// Optionally set a tabindex attribute on the input that gets
|
||||
// created for tag-it.
|
||||
tabIndex: null,
|
||||
|
||||
|
||||
// Event callbacks.
|
||||
onTagAdded : null,
|
||||
onTagRemoved: null,
|
||||
onTagClicked: null
|
||||
},
|
||||
|
||||
|
||||
_create: function() {
|
||||
// for handling static scoping inside callbacks
|
||||
var that = this;
|
||||
|
||||
// There are 2 kinds of DOM nodes this widget can be instantiated on:
|
||||
// 1. UL, OL, or some element containing either of these.
|
||||
// 2. INPUT, in which case 'singleField' is overridden to true,
|
||||
// a UL is created and the INPUT is hidden.
|
||||
if (this.element.is('input')) {
|
||||
this.tagList = $('<ul></ul>').insertAfter(this.element);
|
||||
this.options.singleField = true;
|
||||
this.options.singleFieldNode = this.element;
|
||||
this.element.css('display', 'none');
|
||||
} else {
|
||||
this.tagList = this.element.find('ul, ol').andSelf().last();
|
||||
}
|
||||
|
||||
this._tagInput = $('<input type="text" />').addClass('ui-widget-content');
|
||||
|
||||
if (this.options.tabIndex) {
|
||||
|
||||
this._tagInput.attr('tabindex', this.options.tabIndex);
|
||||
}
|
||||
if (this.options.placeholderText) {
|
||||
this._tagInput.attr('placeholder', this.options.placeholderText);
|
||||
}
|
||||
|
||||
this.options.tagSource = this.options.tagSource || function(search, showChoices) {
|
||||
var filter = search.term.toLowerCase();
|
||||
var choices = $.grep(this.options.availableTags, function(element) {
|
||||
// Only match autocomplete options that begin with the search term.
|
||||
// (Case insensitive.)
|
||||
return (element.toLowerCase().indexOf(filter) === 0);
|
||||
});
|
||||
showChoices(this._subtractArray(choices, this.assignedTags()));
|
||||
};
|
||||
|
||||
// Bind tagSource callback functions to this context.
|
||||
if ($.isFunction(this.options.tagSource)) {
|
||||
this.options.tagSource = $.proxy(this.options.tagSource, this);
|
||||
}
|
||||
|
||||
this.tagList
|
||||
.addClass('tagit')
|
||||
.addClass('ui-widget ui-widget-content ui-corner-all')
|
||||
// Create the input field.
|
||||
.append($('<li class="tagit-new"></li>').append(this._tagInput))
|
||||
.click(function(e) {
|
||||
var target = $(e.target);
|
||||
if (target.hasClass('tagit-label')) {
|
||||
that._trigger('onTagClicked', e, target.closest('.tagit-choice'));
|
||||
} else {
|
||||
// Sets the focus() to the input field, if the user
|
||||
// clicks anywhere inside the UL. This is needed
|
||||
// because the input field needs to be of a small size.
|
||||
that._tagInput.focus();
|
||||
}
|
||||
});
|
||||
|
||||
// Add existing tags from the list, if any.
|
||||
this.tagList.children('li').each(function() {
|
||||
if (!$(this).hasClass('tagit-new')) {
|
||||
that.createTag($(this).html(), $(this).attr('class'));
|
||||
$(this).remove();
|
||||
}
|
||||
});
|
||||
|
||||
// Single field support.
|
||||
if (this.options.singleField) {
|
||||
if (this.options.singleFieldNode) {
|
||||
// Add existing tags from the input field.
|
||||
var node = $(this.options.singleFieldNode);
|
||||
var tags = node.val().split(this.options.singleFieldDelimiter);
|
||||
node.val('');
|
||||
$.each(tags, function(index, tag) {
|
||||
that.createTag(tag);
|
||||
});
|
||||
} else {
|
||||
// Create our single field input after our list.
|
||||
this.options.singleFieldNode = this.tagList.after('<input type="hidden" style="display:none;" value="" name="' + this.options.fieldName + '" />');
|
||||
}
|
||||
}
|
||||
|
||||
// Events.
|
||||
this._tagInput
|
||||
.keydown(function(event) {
|
||||
// Backspace is not detected within a keypress, so it must use keydown.
|
||||
if (event.which == $.ui.keyCode.BACKSPACE && that._tagInput.val() === '') {
|
||||
var tag = that._lastTag();
|
||||
if (!that.options.removeConfirmation || tag.hasClass('remove')) {
|
||||
// When backspace is pressed, the last tag is deleted.
|
||||
that.removeTag(tag);
|
||||
} else if (that.options.removeConfirmation) {
|
||||
tag.addClass('remove ui-state-highlight');
|
||||
}
|
||||
} else if (that.options.removeConfirmation) {
|
||||
that._lastTag().removeClass('remove ui-state-highlight');
|
||||
}
|
||||
|
||||
// Comma/Space/Enter are all valid delimiters for new tags,
|
||||
// except when there is an open quote or if setting allowSpaces = true.
|
||||
// Tab will also create a tag, unless the tag input is empty, in which case it isn't caught.
|
||||
if (
|
||||
event.which == $.ui.keyCode.COMMA ||
|
||||
event.which == $.ui.keyCode.ENTER ||
|
||||
(
|
||||
event.which == $.ui.keyCode.TAB &&
|
||||
that._tagInput.val() !== ''
|
||||
) ||
|
||||
(
|
||||
event.which == $.ui.keyCode.SPACE &&
|
||||
that.options.allowSpaces !== true &&
|
||||
(
|
||||
$.trim(that._tagInput.val()).replace( /^s*/, '' ).charAt(0) != '"' ||
|
||||
(
|
||||
$.trim(that._tagInput.val()).charAt(0) == '"' &&
|
||||
$.trim(that._tagInput.val()).charAt($.trim(that._tagInput.val()).length - 1) == '"' &&
|
||||
$.trim(that._tagInput.val()).length - 1 !== 0
|
||||
)
|
||||
)
|
||||
)
|
||||
) {
|
||||
event.preventDefault();
|
||||
that.createTag(that._cleanedInput());
|
||||
|
||||
// The autocomplete doesn't close automatically when TAB is pressed.
|
||||
// So let's ensure that it closes.
|
||||
that._tagInput.autocomplete('close');
|
||||
}
|
||||
}).blur(function(e){
|
||||
// Create a tag when the element loses focus (unless it's empty).
|
||||
that.createTag(that._cleanedInput());
|
||||
});
|
||||
|
||||
|
||||
// Autocomplete.
|
||||
if (this.options.availableTags || this.options.tagSource) {
|
||||
this._tagInput.autocomplete({
|
||||
source: this.options.tagSource,
|
||||
select: function(event, ui) {
|
||||
// Delete the last tag if we autocomplete something despite the input being empty
|
||||
// This happens because the input's blur event causes the tag to be created when
|
||||
// the user clicks an autocomplete item.
|
||||
// The only artifact of this is that while the user holds down the mouse button
|
||||
// on the selected autocomplete item, a tag is shown with the pre-autocompleted text,
|
||||
// and is changed to the autocompleted text upon mouseup.
|
||||
if (that._tagInput.val() === '') {
|
||||
that.removeTag(that._lastTag(), false);
|
||||
}
|
||||
that.createTag(ui.item.value);
|
||||
// Preventing the tag input to be updated with the chosen value.
|
||||
return false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
_cleanedInput: function() {
|
||||
// Returns the contents of the tag input, cleaned and ready to be passed to createTag
|
||||
return $.trim(this._tagInput.val().replace(/^"(.*)"$/, '$1'));
|
||||
},
|
||||
|
||||
_lastTag: function() {
|
||||
return this.tagList.children('.tagit-choice:last');
|
||||
},
|
||||
|
||||
assignedTags: function() {
|
||||
// Returns an array of tag string values
|
||||
var that = this;
|
||||
var tags = [];
|
||||
if (this.options.singleField) {
|
||||
tags = $(this.options.singleFieldNode).val().split(this.options.singleFieldDelimiter);
|
||||
if (tags[0] === '') {
|
||||
tags = [];
|
||||
}
|
||||
} else {
|
||||
this.tagList.children('.tagit-choice').each(function() {
|
||||
tags.push(that.tagLabel(this));
|
||||
});
|
||||
}
|
||||
return tags;
|
||||
},
|
||||
|
||||
_updateSingleTagsField: function(tags) {
|
||||
// Takes a list of tag string values, updates this.options.singleFieldNode.val to the tags delimited by this.options.singleFieldDelimiter
|
||||
$(this.options.singleFieldNode).val(tags.join(this.options.singleFieldDelimiter));
|
||||
},
|
||||
|
||||
_subtractArray: function(a1, a2) {
|
||||
var result = [];
|
||||
for (var i = 0; i < a1.length; i++) {
|
||||
if ($.inArray(a1[i], a2) == -1) {
|
||||
result.push(a1[i]);
|
||||
}
|
||||
}
|
||||
return result;
|
||||
},
|
||||
|
||||
tagLabel: function(tag) {
|
||||
// Returns the tag's string label.
|
||||
if (this.options.singleField) {
|
||||
return $(tag).children('.tagit-label').text();
|
||||
} else {
|
||||
return $(tag).children('input').val();
|
||||
}
|
||||
},
|
||||
|
||||
_isNew: function(value) {
|
||||
var that = this;
|
||||
var isNew = true;
|
||||
this.tagList.children('.tagit-choice').each(function(i) {
|
||||
if (that._formatStr(value) == that._formatStr(that.tagLabel(this))) {
|
||||
isNew = false;
|
||||
return false;
|
||||
}
|
||||
});
|
||||
return isNew;
|
||||
},
|
||||
|
||||
_formatStr: function(str) {
|
||||
if (this.options.caseSensitive) {
|
||||
return str;
|
||||
}
|
||||
return $.trim(str.toLowerCase());
|
||||
},
|
||||
|
||||
createTag: function(value, additionalClass) {
|
||||
var that = this;
|
||||
// Automatically trims the value of leading and trailing whitespace.
|
||||
value = $.trim(value);
|
||||
|
||||
if (!this._isNew(value) || value === '') {
|
||||
return false;
|
||||
}
|
||||
|
||||
var label = $(this.options.onTagClicked ? '<a class="tagit-label"></a>' : '<span class="tagit-label"></span>').text(value);
|
||||
|
||||
// Create tag.
|
||||
var tag = $('<li></li>')
|
||||
.addClass('tagit-choice ui-widget-content ui-state-default ui-corner-all')
|
||||
.addClass(additionalClass)
|
||||
.append(label);
|
||||
|
||||
// Button for removing the tag.
|
||||
var removeTagIcon = $('<span></span>')
|
||||
.addClass('ui-icon ui-icon-close');
|
||||
var removeTag = $('<a><span class="text-icon">\xd7</span></a>') // \xd7 is an X
|
||||
.addClass('tagit-close')
|
||||
.append(removeTagIcon)
|
||||
.click(function(e) {
|
||||
// Removes a tag when the little 'x' is clicked.
|
||||
that.removeTag(tag);
|
||||
});
|
||||
tag.append(removeTag);
|
||||
|
||||
// Unless options.singleField is set, each tag has a hidden input field inline.
|
||||
if (this.options.singleField) {
|
||||
var tags = this.assignedTags();
|
||||
tags.push(value);
|
||||
this._updateSingleTagsField(tags);
|
||||
} else {
|
||||
var escapedValue = label.html();
|
||||
tag.append('<input type="hidden" style="display:none;" value="' + escapedValue + '" name="' + this.options.itemName + '[' + this.options.fieldName + '][]" />');
|
||||
}
|
||||
|
||||
this._trigger('onTagAdded', null, tag);
|
||||
|
||||
// Cleaning the input.
|
||||
this._tagInput.val('');
|
||||
|
||||
// insert tag
|
||||
this._tagInput.parent().before(tag);
|
||||
},
|
||||
|
||||
removeTag: function(tag, animate) {
|
||||
animate = animate || this.options.animate;
|
||||
|
||||
tag = $(tag);
|
||||
|
||||
this._trigger('onTagRemoved', null, tag);
|
||||
|
||||
if (this.options.singleField) {
|
||||
var tags = this.assignedTags();
|
||||
var removedTagLabel = this.tagLabel(tag);
|
||||
tags = $.grep(tags, function(el){
|
||||
return el != removedTagLabel;
|
||||
});
|
||||
this._updateSingleTagsField(tags);
|
||||
}
|
||||
// Animate the removal.
|
||||
if (animate) {
|
||||
tag.fadeOut('fast').hide('blind', {direction: 'horizontal'}, 'fast', function(){
|
||||
tag.remove();
|
||||
}).dequeue();
|
||||
} else {
|
||||
tag.remove();
|
||||
}
|
||||
},
|
||||
|
||||
removeAll: function() {
|
||||
// Removes all tags.
|
||||
var that = this;
|
||||
this.tagList.children('.tagit-choice').each(function(index, tag) {
|
||||
that.removeTag(tag, false);
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
})(jQuery);
|
||||
|
||||
|
||||
Reference in New Issue
Block a user