diff options
Diffstat (limited to 'jquery.multiple.select.js')
| -rw-r--r-- | jquery.multiple.select.js | 75 |
1 files changed, 38 insertions, 37 deletions
diff --git a/jquery.multiple.select.js b/jquery.multiple.select.js index d24b6c1..bdfa1e9 100644 --- a/jquery.multiple.select.js +++ b/jquery.multiple.select.js @@ -61,32 +61,30 @@ constructor: MultipleSelect, init: function () { - var that = this, - html = []; + var that = this; if (this.options.filter) { - html.push( + this.$drop.append( '<div class="ms-search">', '<input type="text" autocomplete="off" autocorrect="off" autocapitilize="off" spellcheck="false">', '</div>' ); } - html.push('<ul>'); + var ul = $('<ul></ul>'); if (this.options.selectAll && !this.options.single) { - html.push( - '<li class="ms-select-all">', - '<label>', - '<input type="checkbox" ' + this.selectAllName + ' /> ', - this.options.selectAllDelimiter[0] + this.options.selectAllText + this.options.selectAllDelimiter[1], - '</label>', + ul.append( + '<li class="ms-select-all">' + + '<label>' + + '<input type="checkbox" ' + this.selectAllName + ' /> ' + + this.options.selectAllDelimiter[0] + this.options.selectAllText + this.options.selectAllDelimiter[1] + + '</label>' + '</li>' ); } $.each(this.$el.children(), function (i, elm) { - html.push(that.optionToHtml(i, elm)); + ul.append(that.optionToHtml(i, elm)); }); - html.push('<li class="ms-no-results">' + this.options.noMatchesFound + '</li>'); - html.push('</ul>'); - this.$drop.html(html.join('')); + ul.append('<li class="ms-no-results">' + this.options.noMatchesFound + '</li>'); + this.$drop.append(ul); this.$drop.find('ul').css('max-height', this.options.maxHeight + 'px'); this.$drop.find('.multiple').css('width', this.options.multipleWidth + 'px'); @@ -109,7 +107,6 @@ optionToHtml: function (i, elm, group, groupDisabled) { var that = this, $elm = $(elm), - html = [], multiple = this.options.multiple, optAttributesToCopy = ['class', 'title'], clss = $.map(optAttributesToCopy, function (att, i) { @@ -130,45 +127,49 @@ disabled = groupDisabled || $elm.prop('disabled'); if ((this.options.blockSeparator > "") && (this.options.blockSeparator == $elm.val())) { - html.push( + var li = $( '<li' + clss + style + '>', '<label class="' + this.options.blockSeparator + (disabled ? 'disabled' : '') + '">', - text, '</label>', '</li>' ); + li.find('label').append(document.createTextNode(text)); + return li; } else { - html.push( - '<li' + clss + style + '>', - '<label' + (disabled ? ' class="disabled"' : '') + '>', - '<input type="' + type + '" ' + this.selectItemName + ' value="' + value + '"' + + var li = $( + '<li' + clss + style + '>' + + '<label' + (disabled ? ' class="disabled"' : '') + '>' + + '<input type="' + type + '" ' + this.selectItemName + (selected ? ' checked="checked"' : '') + (disabled ? ' disabled="disabled"' : '') + (group ? ' data-group="' + group + '"' : '') + - '/> ', - text, - '</label>', - '</li>' - ); + '/> ' + + '</label>' + + '</li>'); + li.find('input').val(value); + li.find('label').append(document.createTextNode(text)); + return li; } } else if (!group && $elm.is('optgroup')) { var _group = 'group_' + i, label = $elm.attr('label'); disabled = $elm.prop('disabled'); - html.push( - '<li class="group">', - '<label class="optgroup' + (disabled ? ' disabled' : '') + '" data-group="' + _group + '">', + var group = $('<div/>'); + group.append( + '<li class="group">' + + '<label class="optgroup' + (disabled ? ' disabled' : '') + '" data-group="' + _group + '">' + (this.options.hideOptgroupCheckboxes ? '' : '<input type="checkbox" ' + this.selectGroupName + - (disabled ? ' disabled="disabled"' : '') + ' /> '), - label, - '</label>', + (disabled ? ' disabled="disabled"' : '') + ' /> ') + + label + + '</label>' + '</li>'); + li.find('label').append(document.createTextNode(text)); $.each($elm.children(), function (i, elm) { - html.push(that.optionToHtml(i, elm, _group, disabled)); + group.append(that.optionToHtml(i, elm, _group, disabled)); }); + return group.html(); } - return html.join(''); }, events: function () { @@ -315,7 +316,7 @@ if (selects.length === 0) { $span.addClass('placeholder').html(this.options.placeholder); } else if (this.options.countSelected && selects.length < this.options.minimumCountSelected) { - $span.removeClass('placeholder').html( + $span.removeClass('placeholder').text( (this.options.displayValues ? selects : this.getSelects('text')) .join(this.options.delimiter)); } else if (this.options.allSelected && @@ -323,7 +324,7 @@ $span.removeClass('placeholder').html(this.options.allSelected); } else if ((this.options.countSelected || this.options.etcaetera) && selects.length > this.options.minimumCountSelected) { if (this.options.etcaetera) { - $span.removeClass('placeholder').html((this.options.displayValues ? selects : this.getSelects('text').slice(0, this.options.minimumCountSelected)).join(this.options.delimiter) + '...'); + $span.removeClass('placeholder').text((this.options.displayValues ? selects : this.getSelects('text').slice(0, this.options.minimumCountSelected)).join(this.options.delimiter) + '...'); } else { $span.removeClass('placeholder').html(this.options.countSelected @@ -331,7 +332,7 @@ .replace('%', this.$selectItems.length + this.$disableItems.length)); } } else { - $span.removeClass('placeholder').html( + $span.removeClass('placeholder').text( (this.options.displayValues ? selects : this.getSelects('text')) .join(this.options.delimiter)); } |