5

I have a standard <select> and would like to open it when a user clicks on another element. It's pretty simple in a regular browser and even on the iphone, but for some reason nothing working on Android.

I've tried the click and focus events, and also tried changing the size attribute of the select but none of these worked.

Has anyone accomplished this before?

Ariel
  • 4,502
  • 2
  • 21
  • 23

2 Answers2

1

Does other input gain focus?

This simple html select example does work fine in the browser: http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_option check it out on your mobile.

If you are testing in your application, I think your webview is out of focus. A simple plain select does work on android browser. If you want in your own webview javascript you have to enabled it.

Pentium10
  • 204,586
  • 122
  • 423
  • 502
  • When clicked directly the select opens fine. What I'm trying to do is get the select to open when a different element (a picture) is clicked. Also, Im not using it in an app, just an html page. – Ariel Jul 10 '10 at 23:22
  • I don't know what to say, try to look for some place where this does work and copy it from there. – Pentium10 Jul 11 '10 at 09:52
  • Havent seen one yet. May have to just be the first :) – Ariel Jul 14 '10 at 16:13
  • I have the same issue, it would not open by default, when you use the size attribute, wired. I can get it to work in all other browser expect android. :( – Yene Mulatu Aug 27 '13 at 08:55
1

I got it working on iOS/Android only by covering another element with select and making select transparent by opacity:

// HTML
<div class="clickable-styled-container">
  Choose your destiny
  <select>
    <option>Destiny 1</option>
    <option>Destiny 2</option>
  </select>
</div>


// CSS
.is-phone .clickable-styled-container {
  position: relative;
}
.is-phone select {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  bottom: 0;
  opacity: 0;
}
Vincente
  • 341
  • 3
  • 13