I'm trying to figure out how to code for proper use through Android phones. Looking at...
http://www.w3schools.com/TAGS/tryit.asp?filename=tryhtml_select_multiple
...it looks nice when selecting options. However, the page always only shows the first option in the list no matter what is selected. Do you know of anything I can do to handle this better?
I had my coworker load up a test page with a multi-select box.
It appears that on Android (and likely other smartphones) the multi-select elements will only display the first value, since tapping on it brings up (on Android anyways) a dialog to select the elements.
Even using CSS height doesn't change the appearance.
Related
I have a Google Data Studio dashboard that allows users to search a list of people by various criteria. They need to find the person they're looking for in a table and copy-and-paste one of the fields of interest into another application.
On desktop, it's possible to highlight and copy as normal, but on Android (phone and tablet) I can't figure out how to do it:
Long-pressing text brings up the Data Studio context menu. The text also becomes highlighted, but no clipboard menu appears (see image).
Double-tapping triggers the browser's auto-zoom instead of highlighting
Tapping and dragging does nothing
To replicate:
Open this Example table on an Android device in Chrome or Firefox
Attempt to highlight text from the table and copy it to the clipboard
Desired behavior:
Text can be highlighted and copied
Current behavior:
The browser either zooms, or opens the Data Studio context menu, but it is not possible to highlight and copy text.
At this point I'm open to any kind of workaround, even if it's onerous or messy.
What I've tried so far:
Use cross-filtering to feed the selected row's ID into a scorecard or other element: Scorecards have the same behavior
Turn off cross-filtering: This removes the interactivity where tapping a row highlights it, but doesn't change the behavior described above.
Try different mobile browser. I can make it work in Firefox Nightly, which allows you to disable double-tap-to-zoom and in Puffin Browser, which doesn't implement it in the first place. However, neither of these is a good solution for users.
Use presentation mode: If I put the data sheet in presentation mode, turn the device to landscape, and set it to full-width then I can usually but not consistently copy text in Firefox, but not in chrome.
I already know about user-select: none css rule, but it doesn’t help me with my problem.
The thing is I have my own custom menu that appears when I long press or select text in my paragraphs, however the android default menu is displayed on top of my own and hinders the user experience.
I know there is a cordova plugin that already takes care of the issue in iOS but I couldn’t find one for android.
I want to remain able to select my text, with my own custom options on top of that but disable the default android menu. Please help.
I am building a small site and ran into a small problem. I am using MixItUp to filter and sort blocks. I am also using a search field to search through the titles of each block and display relevant ones. Everything works fine on all devices and browsers except for Android.
On Android when I tap into the search field my keyboard slides up and then slides away again without giving me a chance to type anything. I tried googling the problem and only relevant thing I could find was this post but I am not sure how to proceed because I have no clue what event listeners would be disrupting the android one.
I am not a very experienced developer (self-taught and still learning lots) so I am not sure how I would go about correcting. My plan right now is to just remove pieces of code until keyboard starts working and then go from there once I identify what is causing it.
The Website is teste3.khalidsleiman.com
I figured out it was a jQuery snippet that I was using to relocate the input field to a different spot on my page depending on window size. Now I only have it set to run that snippet on document load instead of window load and resize. Keyboard is showing up now.
I'm using Select tag. when approaching by PC, I see all the options to choose from. When approaching by Android, I have to touch the select tag and then a window is popped up with the options.
Is there a way to just get a drop-down (as it works on Windows)?
I have to see four/five options of the select tag without to open the popup clicking on.
This is the standard way Android handles select elements in WebViews. If you want different behavior, you'll have to use a select box library such Select2.
I am developing a cross-platform application using phonegap and jquery. In my HTML document I have a select element with several options. On Android, when the user taps on the select element, an overview of all options opens using the standard Android dropdown (something like an overlay with all options). So far so nice, but unfortunately my options have too much text that eventually gets cut off at the end. How can I adjust the size of the text here? Any hints? Adjusting the text size via CSS is simply ignored. I am thinking of using radio buttons instead, but that is just a workaround for me.
I read listview is another way to handle this problem. Select is fairly limited to my understanding.