Skip to content
Permalink
Browse files

Selectmenu: improved disabled implementation

  • Loading branch information
fnagel committed Sep 24, 2011
1 parent d2a6ead commit 17c8ec587dbf41079cf833d22983ebe1d6d16094
Showing with 54 additions and 36 deletions.
  1. +2 −2 demos/selectmenu/default.html
  2. +52 −34 ui/jquery.ui.selectmenu.js
@@ -38,10 +38,10 @@
<form action="#">
<fieldset>
<label for="speedA">Select a Speed:</label>
<select name="speedA" id="speedA">
<select disabled="disabled" name="speedA" id="speedA">
<option value="Slower">Slower</option>
<option value="Slow">Slow</option>
<option disabled="disabled" value="Medium" selected="selected">Medium</option>
<option value="Medium" selected="selected">Medium</option>
<option value="Fast">Fast</option>
<option value="Faster">Faster</option>
</select>
@@ -52,8 +52,9 @@ $.widget( "ui.selectmenu", {
// get options
self.items = self.element.find( 'option' );

// set options value
// set options
options.value = self.element[0].value;
options.disabled = ( self.element.attr( 'disabled' ) ) ? true : false;

// catch click event of the label
self.element.bind( 'click.selectmenu', function() {
@@ -70,6 +71,7 @@ $.widget( "ui.selectmenu", {
css: {
width: self.element.width()
},
'aria-disabled': options.disabled,
'aria-owns': self.ids[ 1 ],
'aria-haspopup': true
})
@@ -80,7 +82,8 @@ $.widget( "ui.selectmenu", {
primary: ( options.dropdown ? 'ui-icon-triangle-1-s' : 'ui-icon-triangle-2-n-s' )
}
});



self.newelementWrap = $( options.wrapperElement )
.append( self.newelement )
.insertAfter( self.element );
@@ -132,6 +135,13 @@ $.widget( "ui.selectmenu", {
// built menu
self.refresh();

// transfer disabled state
if ( self.element.attr( 'disabled' ) ) {
self.disable();
} else {
self.enable()
}

// document click closes menu
$( document ).bind( 'mousedown.selectmenu', function( event ) {
if ( self.opened && !self.hover) {
@@ -200,40 +210,43 @@ $.widget( "ui.selectmenu", {
options = this.options,
currentItem = self._getSelectedItem();

// close all other selectmenus
$( '.' + self.widgetBaseClass + '-open' ).not( self.newelement ).each( function() {
$( this ).children( 'ul.ui-menu' ).data( 'element.selectelemenu' ).selectmenu( 'close' );
});

if ( options.dropdown ) {
self.newelement
.addClass( 'ui-corner-top' )
.removeClass( 'ui-corner-all' );
}

self.listWrap.addClass( self.widgetBaseClass + '-open' );
self.list.focus().menu( "focus", null, currentItem );

if ( !options.dropdown ) {
// center current item
if ( self.list.css("overflow") == "auto" ) {
self.list.scrollTop( self.list.scrollTop() + currentItem.position().top - self.list.outerHeight()/2 + currentItem.outerHeight()/2 );
}
// calculate offset
var _offset = (self.list.offset().top - currentItem.offset().top + (self.newelement.outerHeight() - currentItem.outerHeight()) / 2);
$.extend( options.position, {
my: "left top",
at: "left top",
offset: "0 " + _offset
});
}
if ( !options.disabled ) {

self.listWrap.position( $.extend({
of: this.newelementWrap
}, options.position ));
// close all other selectmenus
$( '.' + self.widgetBaseClass + '-open' ).not( self.newelement ).each( function() {
$( this ).children( 'ul.ui-menu' ).data( 'element.selectelemenu' ).selectmenu( 'close' );
});

if ( options.dropdown ) {
self.newelement
.addClass( 'ui-corner-top' )
.removeClass( 'ui-corner-all' );
}

self.listWrap.addClass( self.widgetBaseClass + '-open' );
self.list.focus().menu( "focus", null, currentItem );

this.opened = true;
self._trigger( "open", event );
if ( !options.dropdown ) {
// center current item
if ( self.list.css("overflow") == "auto" ) {
self.list.scrollTop( self.list.scrollTop() + currentItem.position().top - self.list.outerHeight()/2 + currentItem.outerHeight()/2 );
}
// calculate offset
var _offset = (self.list.offset().top - currentItem.offset().top + (self.newelement.outerHeight() - currentItem.outerHeight()) / 2);
$.extend( options.position, {
my: "left top",
at: "left top",
offset: "0 " + _offset
});
}

self.listWrap.position( $.extend({
of: this.newelementWrap
}, options.position ));

this.opened = true;
self._trigger( "open", event );
}
},

close: function( event, focus ) {
@@ -319,6 +332,11 @@ $.widget( "ui.selectmenu", {
if ( key === "value" && value) {
this.element[0].value = value;
}
if ( key === "disabled" ) {
this.newelement.button( "option", "disabled", value );
this.list.attr( "aria-disabled", value );
this.close();
}
},

_initSource: function() {

0 comments on commit 17c8ec5

Please sign in to comment.
You can’t perform that action at this time.