jQuery Mobile - Custom Select Menu

Include data-native-menu = "false" attribute to display menu in popup format.

It displays the long list for custom select menu when there is more number of list available.

Include attribute data-mini = "true" for creating mini version custom select menu.

The menu icon is set at left by using data-iconpos = "left" attribute in the fieldset.

Placeholder specifies a short hint that describes the expected value.

The <option> tags are used to define an item in a selection list and the value = "" attribute sets the default value of the variable in the name attribute.

Any <option> w/o value can be kept empty in the custom select menu.

In the <option> tags, add attribute selected = "selected" to select a particular option.

Set the attribute disabled = "disabled" in the <option> element to make the custom select menu option disable.

Include multiple = "multiple" in the <select> elements to make multiple selected option in the custom listview.

Set the icon on the left side by adding the attribute data-iconpos = "left" in the <select> element.

The optgroup jQuery mobile elements is used to group the selection list and the <option> tags are used to define an item under that particular group in a selection list.

Set the data-role = "controlgroup" attribute in the fieldset to vertically group the custom select menu.

Include data-mini="true" attribute in the fieldset to create mini size vertical group custom select menu.

Set the select menu horizontally by including the data-type = "horizontal" to the fieldset.

Include data-mini = "true" attribute in the fieldset to create the horizontal group select menu in the mini size.