Dismiss keyboard on touch outside it

Ionic Framework ionic-v3
1

Hello.
How can i hide the keyboard after the submit is pressed or when i to touch outside of ion-input or ion-searchbar??

3

I found a temporal solution, in the ion-content tag add a function:

And in your ts file:

[quote=“”, post:1, topic:66998, full:true"]
public closeKeyboard(){ console.log('close kb'); Keyboard.close(); }[/quote]

1 Like
4

First of all, this should be the default behavior. In my case, whenever I click outside of input or click submit button, keyboard closes itself. I had problems in beta 11 but no problems in RC0.

Secondly, sometimes when I programmatically want to close keyboard, I don’t use Keyboard.close() as it sometimes work and sometimes doesn’t at least for me.

I call following function to close keyboard. Just copy/paste following function in your code and call whenever you want to close keyboard.

  focusOut() {
    let activeElement = <HTMLElement>document.activeElement;
    activeElement && activeElement.blur && activeElement.blur();
  }

P.S. I copied above function directly from ionic source code https://github.com/driftyco/ionic/blob/master/src/util/form.ts#L27 :stuck_out_tongue:

4 Likes
5

Thanks bro! Great ideia about the Keyboard.close :grin:

6

I find that the keyboard bounces straight back up for some reason.