New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Input Text Into Popups Failing for JQM 1.4.5 on Android 4.3 #7862

Closed
sme150 opened this Issue Dec 1, 2014 · 19 comments

Comments

Projects
None yet
2 participants
@sme150

sme150 commented Dec 1, 2014

This issue seems similar to issues #6116 and #4797.

Using Android 4.2 Devices, I have not had any issues with Form Text Fields within a dialog using a virtual keyboard (Phone or Tablet).

However, on Android 4.3 and 4.4.2, the popup reacts as follows.

  1. Click to open popup and set focus in text field.
  2. Page repositions to center popup in remaining space after keyboard is visible.
  3. Enter any character into text field.

Expected: Keystroke captured, awaits next user input.

Actual: Keystroke captured, dialog disappears, keyboard disappears, then dialog reappears.

This completely blocks usage of text fields within popups on Android OS > 4.2.2 as far as I have found.

Is this a known issue, and are there any noted workarounds?

Repro'd this outside of my app visiting
http://view.jquerymobile.com/master/demos/popup

@gabrielschulhof

This comment has been minimized.

Show comment
Hide comment
@gabrielschulhof

gabrielschulhof Dec 3, 2014

Contributor

I cannot reproduce this behaviour using the popup demo in Chrome on my 10.1" Samsung Galaxy Tab 4 running Android 4.4.2.

I'm opening the "Sign in" popup and typing into the "username" field using the virtual keyboard.

Contributor

gabrielschulhof commented Dec 3, 2014

I cannot reproduce this behaviour using the popup demo in Chrome on my 10.1" Samsung Galaxy Tab 4 running Android 4.4.2.

I'm opening the "Sign in" popup and typing into the "username" field using the virtual keyboard.

@gabrielschulhof

This comment has been minimized.

Show comment
Hide comment
@gabrielschulhof

gabrielschulhof Dec 3, 2014

Contributor

Reproduced in the android emulator.

Contributor

gabrielschulhof commented Dec 3, 2014

Reproduced in the android emulator.

@sme150

This comment has been minimized.

Show comment
Hide comment
@sme150

sme150 Dec 3, 2014

Repro's for me on the ASUS MeMO Pad 7" tablet (Build 11.2.3.18.2)

Could a possible difference would be if repainting is required or not when displaying the popup. Size difference may come into play?

sme150 commented Dec 3, 2014

Repro's for me on the ASUS MeMO Pad 7" tablet (Build 11.2.3.18.2)

Could a possible difference would be if repainting is required or not when displaying the popup. Size difference may come into play?

@sme150

This comment has been minimized.

Show comment
Hide comment
@sme150

sme150 Dec 4, 2014

I am launching an app in January, so this bug is very devastating to our launch date of Jan. 1

Does this look like something that would be an easy fix and be able to be incorporated into a forked build within the next 3 weeks? If not, does anyone have recommendations around converting popup driven forms to another type of form logic that doesn't leave the current page (i.e. toggling Divs, 3rd Party Tools, etc)

Any help here is greatly appreciated.

sme150 commented Dec 4, 2014

I am launching an app in January, so this bug is very devastating to our launch date of Jan. 1

Does this look like something that would be an easy fix and be able to be incorporated into a forked build within the next 3 weeks? If not, does anyone have recommendations around converting popup driven forms to another type of form logic that doesn't leave the current page (i.e. toggling Divs, 3rd Party Tools, etc)

Any help here is greatly appreciated.

@gabrielschulhof

This comment has been minimized.

Show comment
Hide comment
@gabrielschulhof

gabrielschulhof Dec 4, 2014

Contributor

@sme150 I'll have a look today ...

Contributor

gabrielschulhof commented Dec 4, 2014

@sme150 I'll have a look today ...

@gabrielschulhof

This comment has been minimized.

Show comment
Hide comment
@gabrielschulhof

gabrielschulhof Dec 4, 2014

Contributor

@sme150 the good news is that it doesn't seem to be happening everywhere, all the time. For example, http://jsbin.com/lehopo/1/ works just fine. So, I'm going to try and figure out what causes the instability.

Contributor

gabrielschulhof commented Dec 4, 2014

@sme150 the good news is that it doesn't seem to be happening everywhere, all the time. For example, http://jsbin.com/lehopo/1/ works just fine. So, I'm going to try and figure out what causes the instability.

@sme150

This comment has been minimized.

Show comment
Hide comment
@sme150

sme150 Dec 4, 2014

Very cool. Thanks Gabriel, I appreciate the help very much. Let me know if you need anything further from me or for me to test different scenarios to help in the investigation.

sme150 commented Dec 4, 2014

Very cool. Thanks Gabriel, I appreciate the help very much. Let me know if you need anything further from me or for me to test different scenarios to help in the investigation.

@gabrielschulhof

This comment has been minimized.

Show comment
Hide comment
@gabrielschulhof

gabrielschulhof Dec 4, 2014

Contributor

@sme150 I've been able to work around the problem by skipping the repositioning code if the popup remains on-screen despite the window resize events. So, I changed the logic to this: In response to a resize event, before doing any hiding/showing/repositioning, check if any part of the popup is still visible. If so, do nothing.

Contributor

gabrielschulhof commented Dec 4, 2014

@sme150 I've been able to work around the problem by skipping the repositioning code if the popup remains on-screen despite the window resize events. So, I changed the logic to this: In response to a resize event, before doing any hiding/showing/repositioning, check if any part of the popup is still visible. If so, do nothing.

@sme150

This comment has been minimized.

Show comment
Hide comment
@sme150

sme150 Dec 4, 2014

Thanks Gabriel. Is there any change you can provide a jsfiddle of what you are describing, or is this a core change to the JQM itself?

sme150 commented Dec 4, 2014

Thanks Gabriel. Is there any change you can provide a jsfiddle of what you are describing, or is this a core change to the JQM itself?

@gabrielschulhof

This comment has been minimized.

Show comment
Hide comment
@gabrielschulhof

gabrielschulhof Dec 5, 2014

Contributor

@sme150 I'm pretty sure this will require a change to the code for the popup widget.

Contributor

gabrielschulhof commented Dec 5, 2014

@sme150 I'm pretty sure this will require a change to the code for the popup widget.

@sme150

This comment has been minimized.

Show comment
Hide comment
@sme150

sme150 Dec 5, 2014

@gabrielschulhof understood. What is the process to get such a change implemented? I haven't worked with GitHub previously so I am not knowledgeable when it comes to making changes to the JQM scripts themselves.

In the meantime would it be easier for me to get a forked build with your recommended changes while waiting for the change to be implemented in the core product build?

sme150 commented Dec 5, 2014

@gabrielschulhof understood. What is the process to get such a change implemented? I haven't worked with GitHub previously so I am not knowledgeable when it comes to making changes to the JQM scripts themselves.

In the meantime would it be easier for me to get a forked build with your recommended changes while waiting for the change to be implemented in the core product build?

@gabrielschulhof

This comment has been minimized.

Show comment
Hide comment
@gabrielschulhof

gabrielschulhof Dec 7, 2014

Contributor

@sme150 yes, you should probably use a modified copy.

Contributor

gabrielschulhof commented Dec 7, 2014

@sme150 yes, you should probably use a modified copy.

@sme150

This comment has been minimized.

Show comment
Hide comment
@sme150

sme150 Dec 7, 2014

Thanks @gabrielschulhof

Can you possibly send a copy of the changes you made? I am not very versed with editing the jqm scripts and don't want to cause any unintentional regressions by not doing the changes correctly.

sme150 commented Dec 7, 2014

Thanks @gabrielschulhof

Can you possibly send a copy of the changes you made? I am not very versed with editing the jqm scripts and don't want to cause any unintentional regressions by not doing the changes correctly.

@gabrielschulhof

This comment has been minimized.

Show comment
Hide comment
@gabrielschulhof

gabrielschulhof Dec 9, 2014

Contributor

@sme150 http://babulina.go-nix.ca/nix/jquery.mobile.7862-1.4.5.js

Please try that and let me know if it helps with your problem.

Contributor

gabrielschulhof commented Dec 9, 2014

@sme150 http://babulina.go-nix.ca/nix/jquery.mobile.7862-1.4.5.js

Please try that and let me know if it helps with your problem.

@gabrielschulhof

This comment has been minimized.

Show comment
Hide comment
@gabrielschulhof

gabrielschulhof Dec 9, 2014

Contributor

@sme150 I've tried the modification and, basically, it's not at all surprising: If the popup manages to stay on-screen as a result of the appearance of the keyboard, it behaves OK. However, if the keyboard causes it to disappear off-screen, the whole enchilada with the focus-losing starts to happen.

Contributor

gabrielschulhof commented Dec 9, 2014

@sme150 I've tried the modification and, basically, it's not at all surprising: If the popup manages to stay on-screen as a result of the appearance of the keyboard, it behaves OK. However, if the keyboard causes it to disappear off-screen, the whole enchilada with the focus-losing starts to happen.

@sme150

This comment has been minimized.

Show comment
Hide comment
@sme150

sme150 Dec 9, 2014

@gabrielschulhof - I appreciate your help so far! I've checked and the changes don't appear to have caused any regressions with devices that weren't previously experiencing the issue, but you are saying if the input field needs to be re-positioned to be visible, we're back to the same issue correct?

Is there anything else I should test from my side?

sme150 commented Dec 9, 2014

@gabrielschulhof - I appreciate your help so far! I've checked and the changes don't appear to have caused any regressions with devices that weren't previously experiencing the issue, but you are saying if the input field needs to be re-positioned to be visible, we're back to the same issue correct?

Is there anything else I should test from my side?

@sme150

This comment has been minimized.

Show comment
Hide comment
@sme150

sme150 Dec 9, 2014

@gabrielschulhof - Thank you again for your help and solution. I have scenario tested the fix you created and so far I have found no situations where on a phone, tablet, or PC the UI reacts in a way that I am unhappy with. I really appreciate you taking the time to aid with the fix.

Is there anything needed from my side to recommend/submit this for review and integration into the main branch so upcoming versions of JQM will include this fix, or is this a customization I should keep in mind and port into any new version of JQM we adopt?

sme150 commented Dec 9, 2014

@gabrielschulhof - Thank you again for your help and solution. I have scenario tested the fix you created and so far I have found no situations where on a phone, tablet, or PC the UI reacts in a way that I am unhappy with. I really appreciate you taking the time to aid with the fix.

Is there anything needed from my side to recommend/submit this for review and integration into the main branch so upcoming versions of JQM will include this fix, or is this a customization I should keep in mind and port into any new version of JQM we adopt?

@gabrielschulhof

This comment has been minimized.

Show comment
Hide comment
@gabrielschulhof

gabrielschulhof Dec 11, 2014

Contributor

@sme150 I'll push the fix into the next version, although a more detailed analysis may be necessary to determine whether this can be fixed more systematically.

Contributor

gabrielschulhof commented Dec 11, 2014

@sme150 I'll push the fix into the next version, although a more detailed analysis may be necessary to determine whether this can be fixed more systematically.

@sme150

This comment has been minimized.

Show comment
Hide comment
@sme150

sme150 Dec 12, 2014

@gabrielschulhof Perfect. Thanks again. I'll be pushing some final changes into my code over the next couple of week before we go live and will let you know if anything else bypasses this mitigation for any reason, but I think this resolution should at least unblock me for now.

sme150 commented Dec 12, 2014

@gabrielschulhof Perfect. Thanks again. I'll be pushing some final changes into my code over the next couple of week before we go live and will let you know if anything else bypasses this mitigation for any reason, but I think this resolution should at least unblock me for now.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment