Android tabindex and some UI problems.

[Nick]

Hi,
I have an application that i want to run on iOS, Android and WebApp.
Since some features doesn't work as well on all platforms i created the basic functionality, saved that as a plugin and created a different project for each app so i can work out the differences.
I seem to have some UI problems on Android that i cannot solve.

1. I have some problems with the inputs. I have a page for example with 2 inputs and a submit button under them. In many cases when i touch the first input to write, it automatically selects the second, and sometimes, even submits the form by pressing the button (the fields have tabindex for example 10,11 and the button 12)

   I have this problem even on page load in some cases.

2. I use a button which has the text (for example) "case 1" or "case 2". When the user pushes the button it should (and does on iOS) invoke a service and change it's name from "case 1" to "case 2" and visa versa. On Android, if i press the button it invokes the service, changes the name, invoke the other service and changes back to "case 1".
   Only if i focus my finger on the button for a second or so, i have the correct functionality.

   The button only works properly when i tap it for a bit more than usual. By the way the event is triggered on click on the javascript code and it has the form

   if case 1
   service.1
   this.name case 2
   else
   service.2
   this.name case 1

3. Something similar happens to another component. I use a grid with some label, buttons and one image inside it (repeatable from a service) and i hide one of the labels on load. When the user clicks on the grid (anywhere) the label is not hidden anymore so the user can read it and again if he clicks on the grid he will hide it.
   I use toggle on this feature and it does the same as the button above. When i click (tap) on Android devices, the field is visible for a split second and hidden again. If i insist with the click for a bit it stays open as it should.

   Can you check on it a bit please?

   Tell me if you need access to my app. I didn't give you right now cause it is on production stage for iOS and the API is the same so i don't want it to be public.

   Thank you in advance for your time and effort.

[Maryna Brodina]

Hello! Please share the app with a href="mailto:support@appery.io" rel="nofollow"support@appery.io/a if it's possible. Or maybe you can create some test app where it's reproducible. Also clarify what device/version you use to test?

[Nick]

Just did Maryna,
Thanks a lot

[Maryna Brodina]

Thanks for the link! We need to test it, but it might take time.

[Nick]

No problem at all.
We actually deployed it already on Android so i guess we could fix that on a feature upgrade.
Thanks!

[Nick]

FYI just tested it on Android 2.3.3 / Galaxy S plus (GT-I9001) and it works fine...
Still haven't found a solution for Android 4.2 / Galaxy S4

[Maryna Brodina]

Hello! Thanks for update! Could you clarify is this problem on login_screen page?

[Nick]

Yes. Actually i face this problem in every screen that has more than 1 input field.

[Maryna Brodina]

Hello! There're might be such problems on some devices. Please take a look at this post https://getsatisfaction.com/apperyio/...

[Corinne]

Yes I have this problem on Android 4.02.

It would seem there is a double event fired for each tap.and some input events.

I added this JS to fix the issue. Well tested and works great for all Android versions
code
last_click_time = new Date().getTime();
document.addEventListener('click', function (e) {
click_time = e['timeStamp'];
if (click_time && (click_time - last_click_time) < 1000) {
e&#46;stopImmediatePropagation();
e&#46;preventDefault();
&#47;&#47;console&#46;log('click bad');
return false;
}
&#47;&#47;console&#46;log('click ok');
last_click_time = click_time;
}, true);
/code