Manually Show/Hide Device keyboard in JavaScript

Question

Can I manually show/hide device keyboard?

My application is behaving strangely if device keyboard is on display and, say, I hit next button then the CSS of jQuery Mobile is getting distorted. I am not getting any javascript or any other error in the console. Any help is appreciated.

Solution

I have used one of the suggestions in the following question (the one with 84 up votes...), and it worked well for me: iPad Safari - Make keyboard disappear

Lets assume you have an <input type="text" id="myInput" />.

So in your change page code you can do the following, which will first dismiss the keyboard and then perform the page navigation:

function changeToPage1() {
    $("#myInput").blur();
    $(':mobile-pagecontainer').pagecontainer('change','page1.html');
}

Tested in iOS Simulator but should work in Android as well.

Comments

[Admin]

I think he's trying to do IP spoofing for DNS testing purposes, if my understanding is clear. I'm in a similar situation too, so this is useful for me.

[Anup]

stackoverflow.com/questions/9060658/…

[Idan Adar]

What is "Next" button? in the keyboard, or a next button that navigates away to another page in your app? Please explain the scenario so that it could be reproduced.

[Prerak Tiwari]

Its the 'Next' button on the page that navigates away to another page in app.

[Edgar]

I'm actually using Windows 7, for the record. I'm trying to simulate an IP address and DNS before doing it on a live site. The HOSTS thing does work, though, thanks!

[Prerak Tiwari]

I have made the changes. So far it looks good. Since it was a random issue, I cannot tell right now whether it worked or not. I will update the comment once I am done with the testing.

[Prerak Tiwari]

I think its working now. I have tested in 5 different devices. Thanks for the solution.