I´ve got a form with an input field and a submit button. Nothing fancy here...
On the iPhone (iPhone 4S, iOS 5.1) i use the virtual keyboard to fill the input field and when i click/tap on the Go Button of the keyboard the form is submitted. But the virtual keyboard don´t hide after the submit.
If i use the submit button of the form the keyboard disappear. This problem exist only when i click the Go Button of the keyboard
Are there any javascript events i should check? Or do you have a hint for me?
Btw: In other forms with the same structure this problem do not exist.
Thanks in Advance
Use this code in click event to dismiss virtual keyboard
document.activeElement.blur();
Related
Is there a way to close the android keyboard when I'm on the last input of a form, already filled it, and click on the keyboard 'enter' button? It's a web app built with angularjs. Thanks
After the 'enter' button you could focus on an element (an <a> for example) and this should hide the soft keyboard.
Details to catch the enter button here: angularjs move focus to next control on enter
I have a page that is displayed in an UIWebView on an iPad app. The page has an input field, and when the user taps on it, the virtual keyboard popups up.
Currently, the keyboard has the blue 'Go' button. I would like to change the button text from 'Go' to 'Done' and I want to grey-out/disable the button until the user types in at least 1 char.
Is this possible with Javascript/jQuery mobile? I don't have access to the app.
Thanks.
I don't think this is possible. Bu you can change some functionality of the keyboard in html.
Make the button submit your form
Make another keyboard displayed
More features should not be available without access to the app. Instead of greying out the button, you can validate the form before submitting it with jQuery.
For HTML/JS in mobile browsers, I'm having an issue where blur events trigger differently in iOS and Android. In iOS, a user can click on "Done" on the native keyboard, which hides the keyboard and causes the focused element to blur.
The same, however, does not happen when a user clicks the back icon in Android to hide the native keyboard; The elements that were previously focused keep their focus.
Is there a way to listen for the keyboard hiding and trigger a blur on the focused element? Or is there a way to force the Android keyboard to display a "done" button? Or is there a generally better solution?
Maybe a solution would be to listen to the keydown event on the input, and check if the keypress is "Enter".
To do that, please refer to this :
Enter key press event in JavaScript
We have a shopping cart form which has 3 submit buttons (one to update the quantity, one to enter a promo code, and one to finish the checkout).
On desktop the user is expected to click the submit button next to the item they are affecting and this is generally what happens, the button is close to where their mouse/keyboard focus is and the visual association is strong.
On mobile it feels more natural to click the "go" or "submit" button provided by the mobile keyboard. This submits the form using the first submit button on the page rather than the most appropriate one.
Can I change what happens when a mobile user clicks the go/submit button on their keyboard?
My knowledge here is very limited, but can't you use the onsubmit callback? - http://www.htmlgoodies.com/html5/tutorials/HTML5-Development-Form--Keyboard-Events-3885651.htm#fbid=NgeGkg0S2JD
Solved this by disabling the submit buttons and conditionally enabling them based on which form field has the focus (only tested on iPhone so far).
On iPhone anyway the keyboard's go button submits using the first enabled submit button it finds. If there are no enabled buttons the button does nothing (wish it was removed if there is no enabled submit button but this is not the case).
Native iOS apps contain "clear buttons" in input fields. They clear the text while maintaining field focus.
I am developing a web app targeted specifically at iOS devices, and not having any luck emulating the behavior. If I overlay another element with a click event to clear & refocus the input, the iPad ignores the call to focus because it begins hiding the keyboard the instant the blur event fires on the input (before the click event). Therefore the user must manually re-focus the field after clicking the clear icon to get back the keyboard.
Is there any way to grab a touch event on the overlay image/icon without the soft keyboard deciding to vanish, or a better way to do this?
daxelrod's 2nd comment above led me to the solution: Trap the mousedown event on the clear icon, stop it, and clear the input. Thereby a "click" never occurs, and the input does not lose focus.
I thought that blur() fired at the browser level before any of the mouse events (down, up, click) did, so I didn't think to try it. Glad to see I was wrong!
In Mootools flavored JS:
document.id('inputClearImage').addEvent('mousedown', function (e) {
e.stop();
document.id('input').set('value', '');
});