When running http://ichord.github.io/At.js/ page in IE10, it works correctly in a sense it returns focus to textarea after selecting suggestion from autocomplete list. It also works when I use on screen keyboard and touch input (on surface rt or simulator).
When I try to run the same code as WinJs app, it works for mouse/keyboard selection, but when I select item using touch it doesn't return focus to textarea, which is really frustrating.
Is it known bug? Are there any known workarounds to it?
What it interesting it also doesn't hide on screen keyboard.
Related
Situation:
Material Design Floating Labels are stuck with a class="in-focused" even when the input is out of focus. The inputs also contain an iFrame generated from Recurly if that helps.
This seems to happen on (Chrome and Safari) browsers for any iOS Mobile device (iPads iPhones any version). Also, the inputs are all iFrames. Sometimes the cursor will disappear (version 9 and below) when you try to tap back into an empty input field as an additional error. The iFrames are generated from Recurly.
I believe there is an issue with Mobile Safari devices where it doesn't recognize a possible Blur event.
Question:
My goal is to remove the class="is-focused" from any element that is not in focus. What would you you recommend as a solution for this problem?
If you would like to reproduce the error you can see if you go to this url: https://pantaya.com/billing/payment (sign up a dummy account if you need to...) You will see the form that gives these errors.
All advice is helpful! Thank you!
Picture attached to see error:
What is the easiest way to disable the wheel selector that appears on mobile Safari when a user activates a <select> element?
I have styled the <select> and <option> elements myself, and I would prefer that the user interacts directly, rather than with the scroll supplied by the browser.
You can't disable the wheel selector on mobile Safari.
Generally speaking you could probably preventDefault() on click and touch events on the <select>, however it's not clear how you would then make it actually usable. So, you may want to avoid using a select element at all once you detect an iOS device.
You could employ some widget collection such as this one. It can be used to implement dropdown menus or any other kind of menu, and does not open the big wheel thing on the bottom.
As of 2022 this is no longer an issue. Hooray! They finally got rid of the wheel selector. In iOS Safari the select element is now a normal list, similar to Android. I've been waiting years for this issue to be addressed, the wheel selector was awful UX and is finally gone. iOS Safari is actually a good browser now.
I'm getting some odd behaviour in the Chrome browser on HTC One and Galaxy S5.
I click on an input field to enter some data and the keyboard opens and immediately closes again.
I've noticed it only happens on the last available input field on my pages.
Has anyone encountered this issue before?
It works fine on the iPhone and desktop browsers.
Thanks
Ok...so it looks like it has something to do with android browsers redrawing the DOM whenever the keyboard appears. I have $(window).resize() function that is getting called each time the keyboard appears in this case. I may just switch it to use $(window).load().
In chrome or Safari browser, when I select the text on the page I can get the Selection-info by window.getSelection(), And it worked on iPad too.
But when I just click , in browser, I will get a window.getSelection (isCollapsed==true) with full infomation about the position and container . In iPad it just tell you the selection isCollapsed but the position info is 0 or null.
Anyone have an idea how to get the container and the position info when you click in iPad?
Basically using touch events you could do this. It is not just the selection but the number of the fingers you used too. It works on iPad on iPhones on almost every mobile. After setting your handlers for touch events you can map them easily to fire the click events or do something else.
Greetings,
http://marijn.haverbeke.nl/codemirror/jstest.html works on Safari on PC, but not on an Ipad. Which is a shame, since I wanted to use it for an app. My question is not only why does it not work, but how should I go about analyzing things that break on Ipad Safari ?
T.
CodeMirror2 works mostly fine on an iPad;
You can add text, remove text and move the cursor around.
You can however not hilite words and cut / copy / paste (as of today 2012-06-27).
The editor in CodeMirror is actually an iframe, and not a native text input form element. The problem here I suspect is that the browser on the iPad does not know if the keyboard should be activated because some DOM element has key events bound to it.
To do that, Safari would have to analyze the source code to deduce key bindings and when should the keyboard be activated - which sound hugely problematic to me.
perhaps it used an iframe in the past, but I have codemirror on my website now and I see no iframes at all contained inside it.
this is almost one year later though, so perhaps now the situation has changed.