Is there any way to hide keyboard when focusing an ion-input?

5.8k Views Asked by At

I wanted to have an ion-input that will be focused and the keyboard should not appear. Is there any way or is it possible? Thank you!

2

There are 2 best solutions below

3
Kevin Dias On

yes, install this plugin -> https://ionicframework.com/docs/native/keyboard/

html

<ion-input type="text" [(ngModel)]="message"  (ionFocus)="keyboard_show()"  #input ></ion-input>

ts

    import {
      Keyboard
    } from '@ionic-native/keyboard';

    constructor(private keyboard: Keyboard, private ) {
    }
      keyboard_show(){
       this.keyboard.close();
      }
1
Liam Ferris On

I tried Kevin's answer and got the same 'Keyboard' refers to a value, but is being used as a type here. Did you mean 'typeof Keyboard'? issue that Mitesh got.

I resolved this with:

import { Keyboard } from '@ionic-native/keyboard/ngx'

@Component({
  selector: 'app-upload-root',
  templateUrl: 'upload-root.page.html',
  styleUrls: ['upload-root.page.scss'],
  providers: [Keyboard]
})

constructor(private keyboard: Keyboard)

this.keyboard.hide();

Not sure how or why this was needed, but it works for me.