search

jquery-archive / jquery-mobile

jQuery Mobile Framework
https://jquerymobile.com
Other
9.69k stars 2.41k forks source link

A regular html <select> within a jquery mobile page does not work in Android #610

Closed catchgov closed 13 years ago

catchgov commented 13 years ago

Having a regular regular html select inside a jquery mobile page such as the one below,

<select id="listTest" data-role="none"> <option>1</option> <option>2</option> </select>

renders the html select box in android but when clicking on the select box nothing seems to happen. The users are not able to pick any option inside the select box. Tested this with Android 2.2 and the latest jquery mobile build from - http://jquerymobile.com/test/js/

On further debugging found out that the "overflow-x: hidden;" property that was on the ".ui-mobile-viewport" style was causing android to not show up the select options. Once I removed that, the selection boxes work in android. I'm not sure what the side effects of that fix would be.

toddparker commented 13 years ago

We can't reproduce this here on our two 2.2 devices (Droid & HTC Incredible) or the emulator. Are you saying that none of the popup menus are clickable on examples like this: http://jquerymobile.com/test/docs/forms/forms-selects.html

That overflow property is causing some issues and we have that on our radar already.

catchgov commented 13 years ago

No, the examples there work because they're jquery mobile popup menus. The problem happens only when you attempt to have regular html drop-downs (by setting data-role="none" attribute for it) within the jquery mobile page. We want to be able to mix and match jquery mobile controls with standard html controls on the jquery mobile page.

toddparker commented 13 years ago

Ah, gotcha. Re-opening and pushing this up.

catchgov commented 13 years ago

thx!!

minox86 commented 13 years ago

I've got the same problem. I link my post about it (with a simple example) in the developer forum, hoping to help you solving this bug:

http://forum.jquery.com/topic/native-select-problem-with-form-outside-the-page-in-android-2-2

toddparker commented 13 years ago

We created a test page with all form elements with data-role="none" here: http://jquerymobile.com/test/docs/forms/forms-all-native.html

When I test on our HTC Incredible with 2.2, the selects work great. Can you provide a test page where I can reproduce this?

toddparker commented 13 years ago

Closing because a select with a data-role of none is working on our test pages now. Assumed to be fixed in A3 but we can re-open if needed.

micahlmartin commented 13 years ago

This is not working for me either on version A3 or the newest 4.1. I'm testing with Android 2.3.3

toddparker commented 13 years ago

I just tested this in the 2.3 emulator and the native selects seem to work. Downloading 2.3.3 now... http://jquerymobile.com/test/docs/forms/forms-all-native.html

toddparker commented 13 years ago

Ok, I just tested this in the 2.3.3 emulator and had the same results - the selects worked fine. I could open then, select a value, etc. Not sure what to do because I can't reproduce.

You are saying that the selects on this page aren't operable at all in 2.3.3? http://jquerymobile.com/test/docs/forms/forms-all-native.html

micahlmartin commented 13 years ago

That page works for me too. What version of the framework is the page using? None A3 and 4.1 weren't working for me locally. Setting

.ui-mobile-viewport { overflow:visible; }

was the only thing I could do to get it to work. _-- Micah Martin_ Senior Software Engineer BoomTown :: Real Estate Web Platform [direct] 843.300.3306 www.BoomTownROI.com http://www.boomtownroi.com/

facebook http://www.facebook.com/BoomTownROI twitterhttp://www.twitter.com/BoomTownROI

On Thu, Apr 21, 2011 at 4:56 PM, toddparker < reply@reply.github.com>wrote:

I just tested this in the 2.3 emulator and the native selects seem to work. Downloading 2.3.3 now... http://jquerymobile.com/test/docs/forms/forms-all-native.html

Reply to this email directly or view it on GitHub: https://github.com/jquery/jquery-mobile/issues/610#comment_1041359

toddparker commented 13 years ago

The page uses alpha 4.1 from the CDN

That page works for me too. What version of the framework is the page using? None A3 and 4.1 weren't working for me locally. Setting

.ui-mobile-viewport { overflow:visible; }

was the only thing I could do to get it to work. _-- Micah Martin_ Senior Software Engineer BoomTown :: Real Estate Web Platform [direct] 843.300.3306 www.BoomTownROI.com http://www.boomtownroi.com/

facebook http://www.facebook.com/BoomTownROI twitterhttp://www.twitter.com/BoomTownROI

On Thu, Apr 21, 2011 at 4:56 PM, toddparker < reply@reply.github.com>wrote:

I just tested this in the 2.3 emulator and the native selects seem to work. Downloading 2.3.3 now... http://jquerymobile.com/test/docs/forms/forms-all-native.html

Reply to this email directly or view it on GitHub: https://github.com/jquery/jquery-mobile/issues/610#comment_1041359

Reply to this email directly or view it on GitHub: https://github.com/jquery/jquery-mobile/issues/610#comment_1041429