hehaipeng / mobiscroll

Automatically exported from code.google.com/p/mobiscroll
0 stars 0 forks source link

Formatting for Select OptGroup #102

Closed GoogleCodeExporter closed 8 years ago

GoogleCodeExporter commented 8 years ago
Love this!

One question.
Is it possible to retain formatting and elements in scroller when OptGroups are 
used on select elements?

For example, my select field is like this

Group A  (optgroup)
  Sub A  (option)
  Sub B
  Sub C
Group B
  Sub A
  Sub B

Right now it appears the script only looks for the "option" selector, ignoring 
everything else in between the select tags.

/* from mobiscroll.select */

  $('option', elm).each(function() {
            var v = $(this).attr('value');
            main['_' + v] = $(this).text();
            if ($(this).prop('disabled')) invalid.push(v);
        });

It would be nice to be able to keep the headings/formatting within the wheels, 
or at the very least load in the optgroup elements as well so we can apply 
styling via css.

Anyhow, thanks for a great script!

Original issue reported on code.google.com by vall...@gmail.com on 17 Jul 2012 at 11:10

GoogleCodeExporter commented 8 years ago

Original comment by diosla...@gmail.com on 18 Jul 2012 at 5:44

GoogleCodeExporter commented 8 years ago
So here's a first attempt, which seems to be working. Now to add a custom class 
name to the optgroup heading.  

//check if optgroup exists
if ($('optgroup', elm).length != 0){
console.log('optgroup exists');
$('optgroup', elm).each(function() {
            var v = $(this).attr('value');
            main['_' + v] = $(this).attr('label');
              $('option', this).each(function() {
              var x = $(this).attr('value');
              main['_' + x] = $(this).text();
              if ($(this).prop('disabled')) invalid.push(x);
        });
            if ($(this).prop('disabled')) invalid.push(v);
        });

}else {
console.log('optgroup does notexists');
$('option', elm).each(function() {
            var v = $(this).attr('value');
            main['_' + v] = $(this).text();
            if ($(this).prop('disabled')) invalid.push(v);
        });

Original comment by vall...@gmail.com on 18 Jul 2012 at 4:49

GoogleCodeExporter commented 8 years ago
2.1-beta (select preset) has optgroup support, check 
http://docs.mobiscroll.com/21/select-preset for details

Original comment by diosla...@gmail.com on 26 Oct 2012 at 12:05