Is it possible to control the display i.e.(show/hide) of keyboard in iPad Safari through code?
I have 2 form fields; 1. Text box (say Name) 2. Select list/Dropdown (Say State)
My question is when user moves focus from Name to State, the keyboard is still there..Why is it so and how can I hide the keyboard when focus moves to dropdown?
Thank you.
Is it possible to control the display i.e.(show/hide) of keyboard in iPad Safari through code?
I have 2 form fields; 1. Text box (say Name) 2. Select list/Dropdown (Say State)
My question is when user moves focus from Name to State, the keyboard is still there..Why is it so and how can I hide the keyboard when focus moves to dropdown?
Thank you.
Share Improve this question edited Jul 2, 2013 at 14:31 Paul D. Waite 99k57 gold badges203 silver badges271 bronze badges asked Apr 15, 2011 at 9:55 copenndthagencopenndthagen 50.9k105 gold badges313 silver badges491 bronze badges 1- Your question should not ask about showing the keyboard when you are only interested in hiding it. – Michael Commented Nov 29, 2013 at 23:20
2 Answers
Reset to default 2I just ran into a very similar problem, not sure if my solution will work for you.
In my case, I have a text input inside a form. On submit, I'm using e.preventDefault() to stop the page from navigating. I believe this was also having the effect of stopping the default action of hiding the keyboard.
To solve this, I added an explicit input.blur() when the form is submitted. This seemed to be enough for safari to remove the keyboard.
Hope this helps!
I had the same issue. I had a form were keyboard should be collapsed when type out of the field (not native behavior on ipad) and when focus select field. The only solution for me was creation of hidden input
<input type="hidden" id="blurInput" />
and javascript code handler for focus event:
$element = $(event.target);
if($element.is('select')) {
$('#blurInput').blur();
$element.focus();
}
In case you want just to blur input field another solution works perfect, but between input and select it fails
document.activeElement.blur();
$('input').blur();