Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Select box style in Android 2.3 different from Android 4.2

I am working on a PhoneGap app in which clicking on a button generates a specific number of text boxes and select boxes based on user's input.

I tested the app on an AVD running Android 4.2. Everything was working fine and the selectboxes generated along with text boxes looked as the image below:

Now, I tested the same app in an AVD running android 2.3 which gave me the output shown here:

.

Clearly, the select box alone appears weird in Android 2.3 while the other controls like text box and buttons are absolutely fine.

I don't have any clue why this is happening. The app uses JQM and Cordova 2.5.0.

To give you some ground on what I am trying to explain, I have added the code below which is my select box markup

    <select class="sel" data-theme="a" id="selectmenu0">
         <option value="1">option1</option>
         <option value="2">option2</option>
         <option value="3">option3</option>
    </select>
like image 772
bala Avatar asked Jun 27 '13 07:06

bala


1 Answers

I resolved the issue myself. The problem was with the way I generated the markup. For some unknown reason, Android 2.3 expects the DOM to be built before navigating to the next page where the generated DOM will be inserted.

But in my case, On receiving the input from the user, I did the following operations

  1. I navigated to the target page
  2. Then, I built the select box markup

For some reason, Android 2.3 expects the above steps to be in reverse order. Only then, JQM applies it's styling to select box.

like image 196
bala Avatar answered Oct 14 '22 07:10

bala