mirror of
https://github.com/Hopiu/jquery-mobile.git
synced 2026-05-15 01:53:09 +00:00
adding optgroup support. Fixes #567
This commit is contained in:
parent
e6b4634937
commit
68150b5bec
2 changed files with 22 additions and 5 deletions
|
|
@ -128,9 +128,9 @@ $.widget( "mobile.selectmenu", $.mobile.widget, {
|
|||
});
|
||||
|
||||
//events for list items
|
||||
list.delegate("li:not(.ui-disabled)", "click", function(event){
|
||||
list.delegate("li:not(.ui-disabled, .ui-li-divider)", "click", function(event){
|
||||
//update select
|
||||
var newIndex = list.find( "li" ).index( this ),
|
||||
var newIndex = list.find( "li:not(.ui-li-divider)" ).index( this ),
|
||||
prevIndex = select[0].selectedIndex;
|
||||
|
||||
select[0].selectedIndex = newIndex;
|
||||
|
|
@ -155,12 +155,29 @@ $.widget( "mobile.selectmenu", $.mobile.widget, {
|
|||
},
|
||||
|
||||
_buildList: function(){
|
||||
var self = this;
|
||||
var self = this, optgroups = [];
|
||||
|
||||
self.list.empty().filter('.ui-listview').listview('destroy');
|
||||
|
||||
//populate menu with options from select element
|
||||
self.select.find( "option" ).each(function( i ){
|
||||
var $this = $(this),
|
||||
$parent = $this.parent();
|
||||
|
||||
// are we inside an optgroup?
|
||||
if( $parent.is("optgroup") ){
|
||||
var optLabel = $parent.attr("label");
|
||||
|
||||
// has this optgroup already been built yet?
|
||||
if( $.inArray(optLabel, optgroups) === -1 ){
|
||||
var optgroup = $('<li data-role="list-divider"></li>')
|
||||
.text( optLabel )
|
||||
.appendTo( self.list );
|
||||
|
||||
optgroups.push( optLabel );
|
||||
}
|
||||
}
|
||||
|
||||
var anchor = $("<a>", {
|
||||
"role": "option",
|
||||
"href": "#",
|
||||
|
|
@ -196,7 +213,7 @@ $.widget( "mobile.selectmenu", $.mobile.widget, {
|
|||
|
||||
self.button.find( ".ui-btn-text" ).text( $(select[0].options.item(selected)).text() );
|
||||
self.list
|
||||
.find('li').removeClass( $.mobile.activeBtnClass ).attr('aria-selected', false)
|
||||
.find('li:not(.ui-li-divider)').removeClass( $.mobile.activeBtnClass ).attr('aria-selected', false)
|
||||
.eq(selected).addClass( $.mobile.activeBtnClass ).find('a').attr('aria-selected', true);
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ label.ui-select { font-size: 16px; line-height: 1.4; font-weight: normal; margi
|
|||
|
||||
.ui-selectmenu { position: absolute; padding: 0; z-index: 100 !important; width: 80%; max-width: 350px; padding: 6px; }
|
||||
.ui-selectmenu .ui-listview { margin: 0; }
|
||||
|
||||
.ui-selectmenu .ui-btn.ui-li-divider { cursor: default; }
|
||||
.ui-selectmenu-hidden { top: -999999px; left: -99999px; }
|
||||
.ui-selectmenu-screen { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 99; }
|
||||
.ui-screen-hidden, .ui-selectmenu-list .ui-li .ui-icon { display: none; }
|
||||
|
|
|
|||
Loading…
Reference in a new issue