Permalink
Browse files

Custom select: Instead of determining the option that was clicked via…

… a selector, use the "data-option-index" attribute that was set during list creation.

This attribute was being set but it was not being used.
  • Loading branch information...
gabrielschulhof committed Jun 16, 2013
1 parent 04b2f73 commit 5c99158f95e839929906a796f5ed2715ac29cc90
Showing with 25 additions and 24 deletions.
  1. +25 −24 js/widgets/forms/select.custom.js
@@ -82,6 +82,28 @@ $.widget( "mobile.selectmenu", $.mobile.selectmenu, {
.trigger( params.event );
},
_handleListKeydown: function( event ) {
var target = $( event.target ),
li = target.closest( "li" );
// switch logic based on which key was pressed
switch ( event.keyCode ) {
// up or left arrow keys
case 38:
goToAdjacentItem( li, target, "prev" );
return false;
// down or right arrow keys
case 40:
goToAdjacentItem( li, target, "next" );
return false;
// If enter or space is pressed, trigger click
case 13:
case 32:
target.trigger( "click" );
return false;
}
},
build: function() {
var selectId, prefix, popupId, dialogId, label, thisPage, isMultiple, menuId, themeAttr, overlayThemeAttr,
dividerThemeAttr, menuPage, listbox, list, header, headerTitle, menuPageContent, menuPageClose, headerClose, self,
@@ -166,14 +188,15 @@ $.widget( "mobile.selectmenu", $.mobile.selectmenu, {
this.list.attr( "role", "listbox" );
this._on( this.list, {
focusin : "_handleListFocus",
focusout : "_handleListFocus"
focusout : "_handleListFocus",
keydown: "_handleListKeydown"
});
this.list
.delegate( "li:not(.ui-disabled, .ui-li-divider)", "click", function( event ) {
// index of option tag to be selected
var oldIndex = self.select[ 0 ].selectedIndex,
newIndex = self.list.find( "li:not(.ui-li-divider)" ).index( this ),
newIndex = $.mobile.getAttribute( this, "option-index", true ),
option = self._selectOptions().eq( newIndex )[ 0 ];
// toggle selected status on the tag for multi selects
@@ -202,28 +225,6 @@ $.widget( "mobile.selectmenu", $.mobile.selectmenu, {
}
event.preventDefault();
})
.keydown(function( event ) { //keyboard events for menu items
var target = $( event.target ),
li = target.closest( "li" );
// switch logic based on which key was pressed
switch ( event.keyCode ) {
// up or left arrow keys
case 38:
goToAdjacentItem( li, target, "prev" );
return false;
// down or right arrow keys
case 40:
goToAdjacentItem( li, target, "next" );
return false;
// If enter or space is pressed, trigger click
case 13:
case 32:
target.trigger( "click" );
return false;
}
});
// button refocus ensures proper height calculation

0 comments on commit 5c99158

Please sign in to comment.