Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

use enter key to submit form with numeric keypad of android / phonegap

Having trouble with the soft "NUMERIC" keyboard on my android/phonegap application.

My goal: create a simple form on a html5 page (that I will use with phonegap), where the user enters a number using 0-9 characters. To do this, I have used an input field with type = number, and this generates the correct soft keyboard on my android phone.

Unfortunately, I've felt a huge amount of frustration trying to detect when the enter key is pressed on the numeric keyboard. Usually when pressed, instead of submitting the form, the keyboard just goes away. However, if I change the type of the input to "text" then the enter key works as expected and submits the form.

How can I reproduce form submission using the numeric keyboard?

For reference see: http://jsfiddle.net/Ua9yw/13/

WORKING ENTER SUBMISSION BEHAVIOR:

<form> <input type="text"/> </form>

<form id="form1">
    <input type="text"/>
    <input type="submit"/>
</form>

NOT WORKING ENTER BUTTON BEHAVIOR:

<form> <input type="number"/> </form>
<form id="form1">
    <input type="number"/>
    <input type="submit"/>
</form>
like image 748
Rishi Avatar asked Sep 06 '25 05:09

Rishi


1 Answers

You can detect the next keyboard press by using the following bind in JQuery:

$('input').on('keydown', function(e){
    if(e.which === 9) {
        //your code here
    }
});

The next button emulates the tab keypress event on a keyboard, which is key code 9. Unfortunately, keypress and keyup events do not detect the next key event, so you need to bind it on keydown.

like image 200
Rum Jeremy Avatar answered Sep 07 '25 21:09

Rum Jeremy