Is it possible to show/hide the soft keyboard programmatically for Cordova/Phonegap?
Asked
Active
Viewed 1.4k times
4 Answers
4
If the plugin is not working for you, maybe you can play with jquery .focus() and .blur() to show/hide the keyboard.
For example, the keyboard will show when an input is on focus, and to lose the focus you can call blur, and the keyboard will hide.
Stephen Kennedy
- 20,585
- 22
- 95
- 108
Pablo
- 63
- 9
2
The keyboard shows and hides itself based on input focus, in jQuery ...
// Show keyboard:
jQuery('#some-input-id').focus();
// hide keyboard:
jQuery('input, textarea').blur();
No plugin required.
ekerner
- 5,650
- 1
- 37
- 31
1
You can use this plugin https://github.com/ionic-team/ionic-plugin-keyboard
This plugin has two methods
cordova.plugins.Keyboard.show
cordova.plugins.Keyboard.close
PraveenKumar
- 1,851
- 12
- 18
-
After I use the plugin, it shows the error -> Property "plugin" does not exist on type "cordova" when I try to use that two methods. – ping94 Aug 11 '17 at 10:36
-
No. I need to access Apache Cordova plugins by using Typescript – ping94 Aug 11 '17 at 10:53
-
Actually I found this plugin https://github.com/amscomp/cordova-plugin-keyboard, but not able to use the method inside. – ping94 Aug 11 '17 at 10:55
-
Useful link https://stackoverflow.com/questions/23477386/cordova-3-4-detect-keyboard-event – PraveenKumar Aug 11 '17 at 11:05
-1
If you aren't using ionic, you may have luck with this plugin. The Keyboard object is attached to the window, so the API is a little different.
window.Keyboard.show();
window.Keyboard.hide();
It's also worth noting that on iOS only the hide method works. There is no way to manually open the keyboard without having a focused input.
Connor Pearson
- 63,902
- 28
- 145
- 142
-
But it show Property 'Keyboard' does not exist on type 'Window' when I put this two function in index.ts – ping94 Aug 14 '17 at 01:18
-
Have you installed the plugin and waited for the device ready event? – Connor Pearson Aug 14 '17 at 01:29
-
https://stackoverflow.com/a/30740935/754604 may also help. `(
window).Keyboard` – Connor Pearson Aug 14 '17 at 01:33 -
I had installed the plugin and put the "window.Keyboard.hide();" into the function onDeviceReady() – ping94 Aug 14 '17 at 01:33
-
-
-
Try `(
window).Keyboard` instead of `window.Keyboard` or another suggestion from that answer – Connor Pearson Aug 14 '17 at 01:39 -
I had try to put (
window).Keyboard.hide(); into the function onDeviceReady() and testing the result using Android emulator. But the soft keyboard still appear when I focus on the text input. The keyboard plugin Hide method should be works for iOS and Android right? – ping94 Aug 14 '17 at 01:45 -
Yes it should work for both. It does not permanently hide the keyboard though. You will have to call it each time you want to hide the keyboard. – Connor Pearson Aug 14 '17 at 01:47
-
But now it still cannot function. Or maybe I put the (
window).Keyboard.hide() in the wrong place? – ping94 Aug 14 '17 at 01:54 -
-
The soft keyboard still appear when I focus on text input using Android Emulator – ping94 Aug 14 '17 at 01:57
-
-
May I know how to hide the soft keyboard for specific input? For example: I have a text input with id="user" at Login.html, then what should I do to use the
window.Keyboard.hide() in index.ts to hide the soft keyboard? – ping94 Aug 14 '17 at 02:18 -
You should look into the focus event. https://developer.mozilla.org/en-US/docs/Web/Events/focus – Connor Pearson Aug 14 '17 at 02:21
-