RetailCRM-Mirror/select2
1
0
Fork 0
mirror of synced 2024-11-30 00:26:03 +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

48
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,18 +1107,18 @@
* 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 () {
function resolveContainerWidth() {
var style, attrs, matches, i, l; 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';
// next check if there is inline style on the element that contains width } 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'); style = this.opts.element.attr('style');
if (style !== undefined) { if (style !== undefined) {
attrs = style.split(';'); attrs = style.split(';');
@ -1129,28 +1130,24 @@
} }
} }
if (this.opts.width !== 'copy') { if (this.opts.width === "resolve") {
// next check if css('width') can resolve a width that is percent based, this is sometimes possible // 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 // when attached to input type=hidden or elements hidden via css
style = this.opts.element.css('width'); style = this.opts.element.css('width');
if (style.indexOf("%") > 0) return style; if (style.indexOf("%") > 0) return style;
// finally, fallback on the calculated width of the element // finally, fallback on the calculated width of the element
return (this.opts.element.width() === 0 ? 'auto' : this.opts.element.outerWidth() + 'px'); return (this.opts.element.outerWidth() === 0 ? 'auto' : this.opts.element.outerWidth() + 'px');
} }
} else {
return this.opts.width;
}
};
return null; var width = resolveContainerWidth.call(this);
}, if (width !== null) {
this.container.attr("style", "width: "+width);
/** }
* Set the width for the container element.
**/
setContainerWidth : function(container) {
var width = this.getContainerWidth();
if (!width) return;
container.attr('style', "width: " + width);
} }
}); });
@ -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,6 +1999,7 @@
// plugin defaults, accessible to users // plugin defaults, accessible to users
$.fn.select2.defaults = { $.fn.select2.defaults = {
width: "copy",
closeOnSelect: true, closeOnSelect: true,
containerCss: {}, containerCss: {},
dropdownCss: {}, dropdownCss: {},