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

more flexible width strategies. fixes #237

Browse Source
This commit is contained in:
Igor Vaynberg 2012-07-19 10:55:46 +03:00
parent 17ffe5772e
commit 96c0166535
1 changed files with 44 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

88
select2.js
View File

@ -474,6 +474,7 @@
// initialize the container // initialize the container
this.initContainer(); this.initContainer();
this.initContainerWidth();
installFilteredMouseMove(this.results); installFilteredMouseMove(this.results);
this.dropdown.delegate(resultsSelector, "mousemove-filtered", this.bind(this.highlightUnderEvent)); this.dropdown.delegate(resultsSelector, "mousemove-filtered", this.bind(this.highlightUnderEvent));
@ -1106,52 +1107,48 @@
* derived first from option `width` passed to select2, then * derived first from option `width` passed to select2, then
* the inline 'style' on the original element, and finally * the inline 'style' on the original element, and finally
* falls back to the jQuery calculated element width. * falls back to the jQuery calculated element width.
*
* @returns The width string (with units) for the container.
*/ */
// abstract // abstract
getContainerWidth: function () { initContainerWidth: function () {
var style, attrs, matches, i, l; function resolveContainerWidth() {
var style, attrs, matches, i, l;
// see if there is width specified in opts if (this.opts.width === "off") {
if (this.opts.width !== undefined && this.opts.width !== 'copy') return null;
return this.opts.width; } else if (this.opts.width === "element"){
return this.opts.element.outerWidth() === 0 ? 'auto' : this.opts.element.outerWidth() + 'px';
} else if (this.opts.width === "copy" || this.opts.width === "resolve") {
// check if there is inline style on the element that contains width
style = this.opts.element.attr('style');
if (style !== undefined) {
attrs = style.split(';');
for (i = 0, l = attrs.length; i < l; i = i + 1) {
matches = attrs[i].replace(/\s/g, '')
.match(/width:(([-+]?([0-9]*\.)?[0-9]+)(px|em|ex|%|in|cm|mm|pt|pc))/);
if (matches !== null && matches.length >= 1)
return matches[1];
}
}
// next check if there is inline style on the element that contains width if (this.opts.width === "resolve") {
style = this.opts.element.attr('style'); // next check if css('width') can resolve a width that is percent based, this is sometimes possible
if (style !== undefined) { // when attached to input type=hidden or elements hidden via css
attrs = style.split(';'); style = this.opts.element.css('width');
for (i = 0, l = attrs.length; i < l; i = i + 1) { if (style.indexOf("%") > 0) return style;
matches = attrs[i].replace(/\s/g, '')
.match(/width:(([-+]?([0-9]*\.)?[0-9]+)(px|em|ex|%|in|cm|mm|pt|pc))/); // finally, fallback on the calculated width of the element
if (matches !== null && matches.length >= 1) return (this.opts.element.outerWidth() === 0 ? 'auto' : this.opts.element.outerWidth() + 'px');
return matches[1]; }
} } else {
return this.opts.width;
}
};
var width = resolveContainerWidth.call(this);
if (width !== null) {
this.container.attr("style", "width: "+width);
} }
}
if (this.opts.width !== 'copy') {
// next check if css('width') can resolve a width that is percent based, this is sometimes possible
// when attached to input type=hidden or elements hidden via css
style = this.opts.element.css('width');
if (style.indexOf("%") > 0) return style;
// finally, fallback on the calculated width of the element
return (this.opts.element.width() === 0 ? 'auto' : this.opts.element.outerWidth() + 'px');
}
return null;
},
/**
* Set the width for the container element.
**/
setContainerWidth : function(container) {
var width = this.getContainerWidth();
if (!width) return;
container.attr('style', "width: " + width);
}
}); });
SingleSelect2 = clazz(AbstractSelect2, { SingleSelect2 = clazz(AbstractSelect2, {
@ -1173,8 +1170,7 @@
" <ul class='select2-results'>" , " <ul class='select2-results'>" ,
" </ul>" , " </ul>" ,
"</div>"].join("")); "</div>"].join(""));
return container;
this.setContainerWidth(container);
}, },
// single // single
@ -1486,9 +1482,6 @@
" <ul class='select2-results'>" , " <ul class='select2-results'>" ,
" </ul>" , " </ul>" ,
"</div>"].join("")); "</div>"].join(""));
this.setContainerWidth(container);
return container; return container;
}, },
@ -2006,7 +1999,8 @@
// plugin defaults, accessible to users // plugin defaults, accessible to users
$.fn.select2.defaults = { $.fn.select2.defaults = {
closeOnSelect:true, width: "copy",
closeOnSelect: true,
containerCss: {}, containerCss: {},
dropdownCss: {}, dropdownCss: {},
containerCssClass: "", containerCssClass: "",