RetailCRM-Mirror/select2
1
0
Fork 0
mirror of synced 2024-11-26 14:56:07 +03:00
Code Issues Projects Releases Wiki Activity

Merge pull request #1464 from Tuxosaurus/master

Browse Source 
replaces a <div> inside a <a> with a <span>
This commit is contained in:
Igor Vaynberg 2013-06-26 10:07:35 -07:00
commit 476b34bd9a
2 changed files with 77 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
select2.css
View File

@ -82,11 +82,11 @@ Version: @@ver@@ Timestamp: @@timestamp@@
background-image: linear-gradient(top, #eeeeee 0%,#ffffff 90%); background-image: linear-gradient(top, #eeeeee 0%,#ffffff 90%);
} }
.select2-container.select2-allowclear .select2-choice span { .select2-container.select2-allowclear .select2-choice .select2-chosen {
margin-right: 42px; margin-right: 42px;
} }
.select2-container .select2-choice > span { .select2-container .select2-choice > .select2-chosen {
margin-right: 26px; margin-right: 26px;
display: block; display: block;
overflow: hidden; overflow: hidden;
@ -152,7 +152,7 @@ Version: @@ver@@ Timestamp: @@timestamp@@
.select2-drop { .select2-drop {
width: 100%; width: 100%;
margin-top:-1px; margin-top: -1px;
position: absolute; position: absolute;
z-index: 9999; z-index: 9999;
top: 100%; top: 100%;
@ -203,7 +203,7 @@ Version: @@ver@@ Timestamp: @@timestamp@@
border-top: 1px solid #5897fb; border-top: 1px solid #5897fb;
} }
.select2-container .select2-choice div { .select2-container .select2-choice .select2-arrow {
display: inline-block; display: inline-block;
width: 18px; width: 18px;
height: 100%; height: 100%;
@ -230,7 +230,7 @@ Version: @@ver@@ Timestamp: @@timestamp@@
background-image: linear-gradient(top, #cccccc 0%, #eeeeee 60%); background-image: linear-gradient(top, #cccccc 0%, #eeeeee 60%);
} }
.select2-container .select2-choice div b { .select2-container .select2-choice .select2-arrow b {
display: block; display: block;
width: 100%; width: 100%;
height: 100%; height: 100%;
@ -342,12 +342,12 @@ Version: @@ver@@ Timestamp: @@timestamp@@
background-image: linear-gradient(bottom, #ffffff 0%,#eeeeee 50%); background-image: linear-gradient(bottom, #ffffff 0%,#eeeeee 50%);
} }
.select2-dropdown-open .select2-choice div { .select2-dropdown-open .select2-choice .select2-arrow {
background: transparent; background: transparent;
border-left: none; border-left: none;
filter: none; filter: none;
} }
.select2-dropdown-open .select2-choice div b { .select2-dropdown-open .select2-choice .select2-arrow b {
background-position: -18px 1px; background-position: -18px 1px;
} }
@ -464,7 +464,7 @@ disabled look for disabled choices in the results dropdown
cursor: default; cursor: default;
} }
.select2-container.select2-container-disabled .select2-choice div { .select2-container.select2-container-disabled .select2-choice .select2-arrow {
background-color: #f4f4f4; background-color: #f4f4f4;
background-image: none; background-image: none;
border-left: 0; border-left: 0;
@ -584,7 +584,7 @@ disabled look for disabled choices in the results dropdown
background-image: -ms-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); background-image: -ms-linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
background-image: linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%); background-image: linear-gradient(top, #f4f4f4 20%, #f0f0f0 50%, #e8e8e8 52%, #eeeeee 100%);
} }
.select2-container-multi .select2-choices .select2-search-choice span { .select2-container-multi .select2-choices .select2-search-choice .select2-chosen {
cursor: default; cursor: default;
} }
.select2-container-multi .select2-choices .select2-search-choice-focus { .select2-container-multi .select2-choices .select2-search-choice-focus {
@ -669,7 +669,7 @@ disabled look for disabled choices in the results dropdown
/* Retina-ize icons */ /* Retina-ize icons */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi) { @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi) {
.select2-search input, .select2-search-choice-close, .select2-container .select2-choice abbr, .select2-container .select2-choice div b { .select2-search input, .select2-search-choice-close, .select2-container .select2-choice abbr, .select2-container .select2-choice .select2-arrow b {
background-image: url('select2x2.png') !important; background-image: url('select2x2.png') !important;
background-repeat: no-repeat !important; background-repeat: no-repeat !important;
background-size: 60px 40px !important; background-size: 60px 40px !important;

145
select2.js
View File

@ -18,24 +18,24 @@ Apache License or the GPL Licesnse is distributed on an "AS IS" BASIS, WITHOUT W
CONDITIONS OF ANY KIND, either express or implied. See the Apache License and the GPL License for CONDITIONS OF ANY KIND, either express or implied. See the Apache License and the GPL License for
the specific language governing permissions and limitations under the Apache License and the GPL License. the specific language governing permissions and limitations under the Apache License and the GPL License.
*/ */
(function ($) { (function ($) {
if(typeof $.fn.each2 == "undefined"){ if(typeof $.fn.each2 == "undefined") {
$.fn.extend({ $.fn.extend({
/* /*
* 4-10 times faster .each replacement * 4-10 times faster .each replacement
* use it carefully, as it overrides jQuery context of element on each iteration * use it carefully, as it overrides jQuery context of element on each iteration
*/ */
each2 : function (c) { each2 : function (c) {
var j = $([0]), i = -1, l = this.length; var j = $([0]), i = -1, l = this.length;
while ( while (
++i < l ++i < l
&& (j.context = j[0] = this[i]) && (j.context = j[0] = this[i])
&& c.call(j[0], i, j) !== false //"this"=DOM, i=index, j=jQuery object && c.call(j[0], i, j) !== false //"this"=DOM, i=index, j=jQuery object
); );
return this; return this;
} }
}); });
} }
})(jQuery); })(jQuery);
(function ($, undefined) { (function ($, undefined) {
@ -183,7 +183,7 @@ the specific language governing permissions and limitations under the Apache Lic
* the elements under the pointer are scrolled. * the elements under the pointer are scrolled.
*/ */
function installFilteredMouseMove(element) { function installFilteredMouseMove(element) {
element.on("mousemove", function (e) { element.on("mousemove", function (e) {
var lastpos = lastMousePosition; var lastpos = lastMousePosition;
if (lastpos === undefined || lastpos.x !== e.pageX || lastpos.y !== e.pageY) { if (lastpos === undefined || lastpos.x !== e.pageX || lastpos.y !== e.pageY) {
$(e.target).trigger("mousemove-filtered", e); $(e.target).trigger("mousemove-filtered", e);
@ -291,22 +291,22 @@ the specific language governing permissions and limitations under the Apache Lic
function measureTextWidth(e) { function measureTextWidth(e) {
if (!sizer){ if (!sizer){
var style = e[0].currentStyle || window.getComputedStyle(e[0], null); var style = e[0].currentStyle || window.getComputedStyle(e[0], null);
sizer = $(document.createElement("div")).css({ sizer = $(document.createElement("div")).css({
position: "absolute", position: "absolute",
left: "-10000px", left: "-10000px",
top: "-10000px", top: "-10000px",
display: "none", display: "none",
fontSize: style.fontSize, fontSize: style.fontSize,
fontFamily: style.fontFamily, fontFamily: style.fontFamily,
fontStyle: style.fontStyle, fontStyle: style.fontStyle,
fontWeight: style.fontWeight, fontWeight: style.fontWeight,
letterSpacing: style.letterSpacing, letterSpacing: style.letterSpacing,
textTransform: style.textTransform, textTransform: style.textTransform,
whiteSpace: "nowrap" whiteSpace: "nowrap"
}); });
sizer.attr("class","select2-sizer"); sizer.attr("class","select2-sizer");
$("body").append(sizer); $("body").append(sizer);
} }
sizer.text(e.val()); sizer.text(e.val());
return sizer.width(); return sizer.width();
@ -464,12 +464,12 @@ the specific language governing permissions and limitations under the Apache Lic
tmp, tmp,
text = function (item) { return ""+item.text; }; // function used to retrieve the text portion of a data item that is matched against the search text = function (item) { return ""+item.text; }; // function used to retrieve the text portion of a data item that is matched against the search
if ($.isArray(data)) { if ($.isArray(data)) {
tmp = data; tmp = data;
data = { results: tmp }; data = { results: tmp };
} }
if ($.isFunction(data) === false) { if ($.isFunction(data) === false) {
tmp = data; tmp = data;
data = function() { return tmp; }; data = function() { return tmp; };
} }
@ -985,7 +985,6 @@ the specific language governing permissions and limitations under the Apache Lic
var enabled, readonly, self = this; var enabled, readonly, self = this;
// sync enabled state // sync enabled state
var disabled = el.prop("disabled"); var disabled = el.prop("disabled");
if (disabled === undefined) disabled = false; if (disabled === undefined) disabled = false;
this.enable(!disabled); this.enable(!disabled);
@ -1105,14 +1104,14 @@ the specific language governing permissions and limitations under the Apache Lic
height = this.container.outerHeight(false), height = this.container.outerHeight(false),
width = this.container.outerWidth(false), width = this.container.outerWidth(false),
dropHeight = $dropdown.outerHeight(false), dropHeight = $dropdown.outerHeight(false),
viewPortRight = $(window).scrollLeft() + $(window).width(), viewPortRight = $(window).scrollLeft() + $(window).width(),
viewportBottom = $(window).scrollTop() + $(window).height(), viewportBottom = $(window).scrollTop() + $(window).height(),
dropTop = offset.top + height, dropTop = offset.top + height,
dropLeft = offset.left, dropLeft = offset.left,
enoughRoomBelow = dropTop + dropHeight <= viewportBottom, enoughRoomBelow = dropTop + dropHeight <= viewportBottom,
enoughRoomAbove = (offset.top - dropHeight) >= this.body().scrollTop(), enoughRoomAbove = (offset.top - dropHeight) >= this.body().scrollTop(),
dropWidth = $dropdown.outerWidth(false), dropWidth = $dropdown.outerWidth(false),
enoughRoomOnRight = dropLeft + dropWidth <= viewPortRight, enoughRoomOnRight = dropLeft + dropWidth <= viewPortRight,
aboveNow = $dropdown.hasClass("select2-drop-above"), aboveNow = $dropdown.hasClass("select2-drop-above"),
bodyOffset, bodyOffset,
above, above,
@ -1136,7 +1135,6 @@ the specific language governing permissions and limitations under the Apache Lic
//console.log("above/ offset.top", offset.top, "dropHeight", dropHeight, "top", (offset.top-dropHeight), "scrollTop", this.body().scrollTop(), "enough?", enoughRoomAbove); //console.log("above/ offset.top", offset.top, "dropHeight", dropHeight, "top", (offset.top-dropHeight), "scrollTop", this.body().scrollTop(), "enough?", enoughRoomAbove);
// fix positioning when body has an offset and is not position: static // fix positioning when body has an offset and is not position: static
if (this.body().css('position') !== 'static') { if (this.body().css('position') !== 'static') {
bodyOffset = this.body().offset(); bodyOffset = this.body().offset();
dropTop -= bodyOffset.top; dropTop -= bodyOffset.top;
@ -1144,7 +1142,6 @@ the specific language governing permissions and limitations under the Apache Lic
} }
// always prefer the current above/below alignment, unless there is not enough room // always prefer the current above/below alignment, unless there is not enough room
if (aboveNow) { if (aboveNow) {
above = true; above = true;
if (!enoughRoomAbove && enoughRoomBelow) above = false; if (!enoughRoomAbove && enoughRoomBelow) above = false;
@ -1435,7 +1432,7 @@ the specific language governing permissions and limitations under the Apache Lic
highlightUnderEvent: function (event) { highlightUnderEvent: function (event) {
var el = $(event.target).closest(".select2-result-selectable"); var el = $(event.target).closest(".select2-result-selectable");
if (el.length > 0 && !el.is(".select2-highlighted")) { if (el.length > 0 && !el.is(".select2-highlighted")) {
var choices = this.findHighlightableChoices(); var choices = this.findHighlightableChoices();
this.highlight(choices.index(el)); this.highlight(choices.index(el));
} else if (el.length == 0) { } else if (el.length == 0) {
// if we are over an unselectable item remove al highlights // if we are over an unselectable item remove al highlights
@ -1532,8 +1529,8 @@ the specific language governing permissions and limitations under the Apache Lic
if (maxSelSize >=1) { if (maxSelSize >=1) {
data = this.data(); data = this.data();
if ($.isArray(data) && data.length >= maxSelSize && checkFormatter(opts.formatSelectionTooBig, "formatSelectionTooBig")) { if ($.isArray(data) && data.length >= maxSelSize && checkFormatter(opts.formatSelectionTooBig, "formatSelectionTooBig")) {
render("<li class='select2-selection-limit'>" + opts.formatSelectionTooBig(maxSelSize) + "</li>"); render("<li class='select2-selection-limit'>" + opts.formatSelectionTooBig(maxSelSize) + "</li>");
return; return;
} }
} }
@ -1741,21 +1738,21 @@ the specific language governing permissions and limitations under the Apache Lic
// single // single
createContainer: function () { createContainer: function () {
var container = $(document.createElement("div")).attr({ var container = $(document.createElement("div")).attr({
"class": "select2-container" "class": "select2-container"
}).html([ }).html([
"<a href='javascript:void(0)' onclick='return false;' class='select2-choice' tabindex='-1'>", "<a href='javascript:void(0)' onclick='return false;' class='select2-choice' tabindex='-1'>",
" <span>&nbsp;</span><abbr class='select2-search-choice-close'></abbr>", " <span class='select2-chosen'>&nbsp;</span><abbr class='select2-search-choice-close'></abbr>",
" <div><b></b></div>" , " <span class='select2-arrow'><b></b></span>",
"</a>", "</a>",
"<input class='select2-focusser select2-offscreen' type='text'/>", "<input class='select2-focusser select2-offscreen' type='text'/>",
"<div class='select2-drop select2-display-none'>" , "<div class='select2-drop select2-display-none'>",
" <div class='select2-search'>" , " <div class='select2-search'>",
" <input type='text' autocomplete='off' autocorrect='off' autocapitalize='off' spellcheck='false' class='select2-input'/>" , " <input type='text' autocomplete='off' autocorrect='off' autocapitalize='off' spellcheck='false' class='select2-input'/>",
" </div>" , " </div>",
" <ul class='select2-results'>" , " <ul class='select2-results'>",
" </ul>" , " </ul>",
"</div>"].join("")); "</div>"].join(""));
return container; return container;
}, },
@ -1995,7 +1992,7 @@ the specific language governing permissions and limitations under the Apache Lic
if (data) { // guard against queued quick consecutive clicks if (data) { // guard against queued quick consecutive clicks
var placeholderOption = this.getPlaceholderOption(); var placeholderOption = this.getPlaceholderOption();
this.opts.element.val(placeholderOption ? placeholderOption.val() : ""); this.opts.element.val(placeholderOption ? placeholderOption.val() : "");
this.selection.find("span").empty(); this.selection.find(".select2-chosen").empty();
this.selection.removeData("select2-data"); this.selection.removeData("select2-data");
this.setPlaceholder(); this.setPlaceholder();
@ -2093,7 +2090,7 @@ the specific language governing permissions and limitations under the Apache Lic
// check for a placeholder option if attached to a select // check for a placeholder option if attached to a select
if (this.select && this.getPlaceholderOption() === undefined) return; if (this.select && this.getPlaceholderOption() === undefined) return;
this.selection.find("span").html(this.opts.escapeMarkup(placeholder)); this.selection.find(".select2-chosen").html(this.opts.escapeMarkup(placeholder));
this.selection.addClass("select2-default"); this.selection.addClass("select2-default");
@ -2169,7 +2166,7 @@ the specific language governing permissions and limitations under the Apache Lic
// single // single
updateSelection: function (data) { updateSelection: function (data) {
var container=this.selection.find("span"), formatted, cssClass; var container=this.selection.find(".select2-chosen"), formatted, cssClass;
this.selection.data("select2-data", data); this.selection.data("select2-data", data);
@ -2277,17 +2274,16 @@ the specific language governing permissions and limitations under the Apache Lic
var container = $(document.createElement("div")).attr({ var container = $(document.createElement("div")).attr({
"class": "select2-container select2-container-multi" "class": "select2-container select2-container-multi"
}).html([ }).html([
" <ul class='select2-choices'>", "<ul class='select2-choices'>",
//"<li class='select2-search-choice'><span>California</span><a href="javascript:void(0)" class="select2-search-choice-close"></a></li>" , " <li class='select2-search-field'>",
" <li class='select2-search-field'>" , " <input type='text' autocomplete='off' autocorrect='off' autocapitilize='off' spellcheck='false' class='select2-input'>",
" <input type='text' autocomplete='off' autocorrect='off' autocapitilize='off' spellcheck='false' class='select2-input'>" , " </li>",
" </li>" , "</ul>",
"</ul>" , "<div class='select2-drop select2-drop-multi select2-display-none'>",
"<div class='select2-drop select2-drop-multi select2-display-none'>" , " <ul class='select2-results'>",
" <ul class='select2-results'>" , " </ul>",
" </ul>" ,
"</div>"].join("")); "</div>"].join(""));
return container; return container;
}, },
// multi // multi
@ -2380,11 +2376,6 @@ the specific language governing permissions and limitations under the Apache Lic
_this.search[0].focus(); _this.search[0].focus();
_this.selectChoice($(this)); _this.selectChoice($(this));
}) })
//.sortable({
// items: " > li",
// tolerance: "pointer",
// revert: 100
//});
// rewrite labels from original element to focusser // rewrite labels from original element to focusser
this.search.attr("id", "s2id_autogen"+nextUid()); this.search.attr("id", "s2id_autogen"+nextUid());
@ -2619,7 +2610,6 @@ the specific language governing permissions and limitations under the Apache Lic
focus: function () { focus: function () {
this.close(); this.close();
this.search.focus(); this.search.focus();
//this.opts.element.triggerHandler("focus");
}, },
// multi // multi
@ -2821,11 +2811,11 @@ the specific language governing permissions and limitations under the Apache Lic
//If all results are chosen render formatNoMAtches //If all results are chosen render formatNoMAtches
if(!this.opts.createSearchChoice && !choices.filter('.select2-result:not(.select2-selected)').length > 0){ if(!this.opts.createSearchChoice && !choices.filter('.select2-result:not(.select2-selected)').length > 0){
if(!data || data && !data.more && this.results.find(".select2-no-results").length === 0) { if(!data || data && !data.more && this.results.find(".select2-no-results").length === 0) {
if (checkFormatter(self.opts.formatNoMatches, "formatNoMatches")) { if (checkFormatter(self.opts.formatNoMatches, "formatNoMatches")) {
this.results.append("<li class='select2-no-results'>" + self.opts.formatNoMatches(self.search.val()) + "</li>"); this.results.append("<li class='select2-no-results'>" + self.opts.formatNoMatches(self.search.val()) + "</li>");
} }
} }
} }
}, },
@ -2838,7 +2828,7 @@ the specific language governing permissions and limitations under the Apache Lic
// multi // multi
resizeSearch: function () { resizeSearch: function () {
var minimumWidth, left, maxWidth, containerLeft, searchWidth, var minimumWidth, left, maxWidth, containerLeft, searchWidth,
sideBorderPadding = getSideBorderPadding(this.search); sideBorderPadding = getSideBorderPadding(this.search);
minimumWidth = measureTextWidth(this.search) + 10; minimumWidth = measureTextWidth(this.search) + 10;
@ -2985,7 +2975,6 @@ the specific language governing permissions and limitations under the Apache Lic
this.resizeSearch(); this.resizeSearch();
// update selection // update selection
this.selection.find(".select2-search-choice").each(function() { this.selection.find(".select2-search-choice").each(function() {
val.push(self.opts.id($(this).data("select2-data"))); val.push(self.opts.id($(this).data("select2-data")));
}); });