[Need Help] Collapse Keypad when viewing on Mobile

mobile-prototyping
#1

Hey guys, I’ve been searching solution for this problem for a while, really appreciate if anyone can help me out.

Problem: when viewing the prototype on mobile, how can I hide/defocus/collapse the keypad after filling a text field and triggering submit button?
I’ve tried “Set Focus” on another widget but it doesn’t work.

#2

Hi Hai–It sounds like the keyboard on your OS isn’t hiding after you have completed typing in your text fields. The device keyboard should hide itself automatically after the text field loses focus, such as when you tap outside of the text field or on another widget. On Android, using the device’s back button should also close the keyboard.

If the above methods of defocusing the text field don’t work in your prototype, then we have a few questions:

  1. What version and build of Axure RP are you using? Is it the latest build of version 8 (build 3338)?
  2. What OS is your mobile device running?
  3. Is the issue happening in your mobile browser, in the Axure Share app, or both?
  4. If possible, please send a copy of the file or a sample file that demonstrates the issue so that we can take a look. If you’d rather not post the file here, you can send it over to support@axure.com so that we can assist via email.

Thanks!

#3

@Alyssa_Axure …It’s happening to me too. They keyboard is not hiding automatically on the iPad pro browser and Axure share app. Please help!

#4

Hi @sonaliagrawal,

can you attach a file with your problem.
Usually the keyboard should hide as soon as the input loses focus. Sometimes it helps to set the focus actively on another element. But keep in mind that not every element in your file can be focused.
You can try this:

  • Setting the focus on the Button you’re clicking/tapping
  • Setting the focus on another HTML form element

See the attached file for a working example.
HideKeyboardTest.rp (63.5 KB)

#5

It’s a full project file that is going to be presented soon to the client, and it’s sensitive too, hence i won’t be able to share it, but let me try and get the first sign in page as a sample to show you what’s happening.

#6

@dan.adam Please find the RP file with the login page here…the issue is happening with all the form fields in the project file. Do check it on the iPad if possible please!

Login_screen.rp (664.7 KB)

#7

Were you able to figure something out @dan.adam? Appreciate your help!

#8

Hi @sonaliagrawal,
that’s weird. It works fine for me. Tested it on an iPad Air with iOS 11.
As soon as I click/tap on the “sign in”-button the keyboard hides automatically as it should.

#9

@dan.adam I wonder if it’s got to do something with iOS 12. My colleagues tested it as well, and keypad on his doesn’t go away either! He checked it on the iPad browser.

#10

I added “Wait: 50ms” as first action (OnClick) in the submit button and now it works fine. I hope this will help :slight_smile: