library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2025-01-07 20:34:24 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Selectmenu: Properly set width for button

Browse Source 
Fixes #10145
Closes gh-1296
This commit is contained in:
Scott González 2014-07-29 10:40:02 -04:00
parent d1e327c189
commit 45e13ed208
2 changed files with 26 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
tests/unit/selectmenu/selectmenu_options.js
View File

@ -86,8 +86,8 @@ test( "CSS styles", function() {
}); });
test( "Width", function() { test( "width", function() {
expect( 8 ); expect( 9 );
var button, menu, var button, menu,
element = $( "#speed" ); element = $( "#speed" );
@ -124,6 +124,14 @@ test( "Width", function() {
equal( button.outerWidth(), element.outerWidth(), "button width with long option" ); equal( button.outerWidth(), element.outerWidth(), "button width with long option" );
element.selectmenu( "open" ); element.selectmenu( "open" );
ok( menu.outerWidth() >= element.outerWidth(), "menu width with long option" ); ok( menu.outerWidth() >= element.outerWidth(), "menu width with long option" );
element.parent().outerWidth( 300 );
element
.selectmenu( "destroy" )
.css( "width", "100%" )
.selectmenu();
button = element.selectmenu( "widget" );
equal( button.outerWidth(), 300, "button width fills container" );
}); });
})( jQuery ); })( jQuery );

22
ui/selectmenu.js
View File

@ -106,7 +106,7 @@ return $.widget( "ui.selectmenu", {
.appendTo( this.button ); .appendTo( this.button );
this._setText( this.buttonText, this.element.find( "option:selected" ).text() ); this._setText( this.buttonText, this.element.find( "option:selected" ).text() );
this._setOption( "width", this.options.width ); this._resizeButton();
this._on( this.button, this._buttonEvents ); this._on( this.button, this._buttonEvents );
this.button.one( "focusin", function() { this.button.one( "focusin", function() {
@ -186,7 +186,9 @@ return $.widget( "ui.selectmenu", {
refresh: function() { refresh: function() {
this._refreshMenu(); this._refreshMenu();
this._setText( this.buttonText, this._getSelectedItem().text() ); this._setText( this.buttonText, this._getSelectedItem().text() );
this._setOption( "width", this.options.width ); if ( !this.options.width ) {
this._resizeButton();
}
}, },
_refreshMenu: function() { _refreshMenu: function() {
@ -475,10 +477,7 @@ return $.widget( "ui.selectmenu", {
} }
if ( key === "width" ) { if ( key === "width" ) {
if ( !value ) { this._resizeButton();
value = this.element.outerWidth();
}
this.button.outerWidth( value );
} }
}, },
@ -511,6 +510,17 @@ return $.widget( "ui.selectmenu", {
this.menu.attr( "aria-hidden", !this.isOpen ); this.menu.attr( "aria-hidden", !this.isOpen );
}, },
_resizeButton: function() {
var width = this.options.width;
if ( !width ) {
width = this.element.show().outerWidth();
this.element.hide();
}
this.button.outerWidth( width );
},
_resizeMenu: function() { _resizeMenu: function() {
this.menu.outerWidth( Math.max( this.menu.outerWidth( Math.max(
this.button.outerWidth(), this.button.outerWidth(),