List Options

Description

The listview plugin has the following options:

countTheme

countTheme string
default: "c"

Sets the theme swatch color scheme for the badges or count bubbles. This is a letter from a-z.

This option is also exposed as a data attribute: data-count-theme="a".

$( "#list1" ).listview({ countTheme: "a" });

dividerTheme

dividerTheme  string
default: "b"

Sets the theme scheme for the list dividers.

This is a letter from a-z. This option is also exposed as a data attribute: data-divider-theme="a".

$( "#list1" ).listview({ dividerTheme: "a" });

initSelector

initSelector CSS selector string
default: ":jqmData(role='listview')"

The initSelector is used to define the selectors that are used to trigger the automatic initialization of the widget plugin.

For instance, all elements that are matched by the default selector will be enhanced by the listview plugin.

To override this selector, bind to the mobileinit event and update the selector as needed:


$(  document   ).bind( "mobileinit", function(){
    $.mobile.listview.prototype.options.initSelector  = "...";
});

inset

inset boolean
default: false

An inset list will be created when this option is set to true.

By default, a basic list will be created. This option is also exposed as a data attribute: data-inset="true".

$("#list1").listview({inset:true});

splitIcon

splitIcon string
default: "arrow-r"

Sets the icon for the secondary button when building a split button list. This option is also exposed as a data attribute: data-split-icon="star".

$( "#list1" ).listview({ splitIcon: "star" });

splitTheme

splitTheme string
default: "b"

Sets the theme swatch color scheme for the secondary button when creating a split button list. This is a letter from a-z.

This option is also exposed as a data attribute: data-split-theme="a".

$( "#list1" ).listview({ splitTheme: "a" });

theme

theme string
default: "c"

Sets the theme swatch color scheme for the list. This is a letter from a-z.

This option is also exposed as a data attribute: data-theme="a".

$( "#list1" ).listview({ theme: "a" });




















Home »
  jQuery Mobile »
    Tutorial »




jQuery_Mobile
Form
List
Layout
Theme