Keyboard persistence - stopping the keyboard dismissing when interacting with other elements on the page

Ionic Framework ionic-v3
1

Hi guys. So currently i’m working on an app that includes a messenger-like chat component, and i’ve hit a brick wall (probably counting something like 10+ hours working on this problem alone).

If you open messenger, you will see that after you tap the message bar, and type a message:

  1. The keyboard stays up, doesn’t flash or disappear.
  2. The focus is still on the text input.
  3. If you scroll the messages area up or down, the keyboard stays in position and the input stays focused.

I’ve been through countless threads on Github issues about this, many closed off (in my opinion some prematurely) about keeping the keyboard open, some are saying:

  1. Call preventDefault() on the $event from either a click or mousedown event - This hasn’t worked so far for me, the keyboard still dismisses and the focus comes away from the input.
  2. Call .setFocus() on a ViewChild() reference to the input itself - when i do this, i either get told that the input’s ViewChild object is not an object, or that the setFocus() method does not exist. Also, i’ve tried calling this.mainInput.nativeElement.focus(), and that also fails.
  3. I have the <preference name="KeyboardDisplayRequiresUserAction" value="false" /> preference in my config.xml - it doesn’t affect anything.
  4. I’ve also tried manually adding the event listeners as per this github thread: https://github.com/ionic-team/ionic-plugin-keyboard/issues/81#issuecomment-318948443 - but no luck, the listeners never seem to bind and clicking the button dismisses the keyboard and doesn’t fire any of the listeners at all - in fact if you console.log the element itself (this.mainInput), it outputs null.

I would love it if anyone has any advice for how to achieve this, as at this point i’m not even sure it’s possible with Ionic and may need to move my client to react native (which will cost me money, and delay the delivery to the client).

Any help is really appreciated guys - i may even be able to pay for some consulting time for this.

I’d also really appreciate it if the Core devs could let me know if it’s possible at all!

Many many thanks.
Dan.

1 Like
2

try preventDefault from mouseDown event, not click event. After click you’re too late, focus is already lost.

3

Hey - thanks, but i’ve already tried this, it’s point #1 on the list of things i put in the original post.

I might try and extract the use case into it’s own demo application and see if i can do it there.