A J
A J

Reputation: 4632

show full content in jquery mobile select box data-native-menu=“false”

How to show full content in jquery mobile? I used Select box:

<select data-native-menu="false">

<option>Monday</option>
<option>Sunday jnnj jnkn ikni nin iuniu niun uin iun in in io nono no no n oino  on i </option>
<option>Tuesday</option>

http://jsfiddle.net/8xusq/65/

enter image description here

Upvotes: 0

Views: 459

Answers (1)

ezanker
ezanker

Reputation: 24738

First give your select an ID:

<select data-native-menu="false" id="mySelect">...

For data-native-menu="false", jQM creates either a popup or a dialog (depending on the length of the list and space available) to display the options. The ID of the created popup or dialog is the select ID plus "-listbox-popup" or plus "dialog".

So you can add CSS that allows the text of the options to wrap:

#mySelect-listbox-popup ul li a.ui-link-inherit, #mySelect-dialog ul li a.ui-link-inherit {
    white-space: normal;
}

Updated FIDDLE

Upvotes: 1

Related Questions