Phonegap input type text show Go button on soft keyboard, I have multiple text boxes so want Next button on keyboard so user can move easily and on last input want Go so user can press to submit form.
And on Android kitkatt keyboard top bar also not displaying Next|Prev buttons.
Having a "Next" button instead of "Go" for input type="text" would not be possible with Android as of now.
Android will always display "Go" button for form input fields irrespective of the position of the field you are at in the form. "Go" is basically reflecting the same behavior as of an "Enter" button on a normal browser & keyboard.
There are two possible hacks to come closer to what you need (still won't change "Go" to "Next" but will help "Go" act as "Next") -
Hack 1 - Hijack Enter key event & move focus to next fields
Like I mentioned the "Go" key replicates the "Enter" key, you can capture the enter key event using JavaScript & make it move focus to next fields in form until its your last field. Once last field reaches you can allow it to act as enter. So basically Go will keep moving focus to next fields until its your last field & then will submit the form.
I have answered a solution to a similar requirement here - How to trigger a Tab when user presses Enter, you can try implementing the same in your app.
DEMO LINK - http://codepen.io/nitishdhar/pen/Gxbhm
Hack 2 - Force form validation & move focus to next invalid fields
If you want to prevent users from submitting the form, you can put required validations on the form using java-script & if some field is not filled, upon pressing "Go" the focus of the cursor can be brought to the next "not filled" field. So in a way giving the impression of - "Pressing Go & moving to next field to be filled"
Try this plugin - http://jqueryvalidation.org/ this behaves in the way explained i.e moves focus to the next required or invalid field.
Also I think some android versions show some tab key on the keyboard to move between fields, buts its not Next.
All the best.
Related
This is driving me crazy and I can't find the answer anywhere.
I have forms in my phonegap app. If the input type="text", the text keyboard pops up and "go" is displayed in the corner. When you click go, it submits the form. That all works as I would expect. But if I use input type="number", the number keyboard pops up and "next" is displayed in the corner. When you click next, if there is another input box before the button tag, it goes to that input. That's okay. . . not ideal, but makes sense. But if it is the last input field on the page, click "next" does nothing. It doesn't put focus on the button (even with tabindex) and it doesn't submit the form (ideal).
I'm using phonegap 1.3.0 and jquery 1.7 if any of that helps.
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.
Hope that helps!
Okay, now I do have something that looks like an answer and quacks like an answer.
It's a horrible hack, and I am experiencing some side-effects at this point, but it's a small leap for mankind anyway.
Add an invisible text input to your form, which automatically submits the form as soon as it receives focus. Since it can only receive focus from the user pressing 'Next' or tabbing from the last number field, there should be a pretty solid logic in the user sequence.
<input type='text' style="opacity:0;" onfocus="javascript:$('#thisForm').submit();">
The side effects are:
the hidden form field will briefly be visible. You can avoid this by
using the onfocus handler to also re-focus on the number field that
was just left. Or you can set the width of the input to 0. The latter works best for me.
if you're using jQueryMobile like me, you're inviting horrible page transition ugliness on yourself, so if your form is in a dialog and submitting the form closes the dialog, be sure to set the dialog transition (when it is being opened from a previous screen) to 'none'.
I am relatively new to Android development. My requirement is such that I have a multiple line input box(such as comment box); as the user clicks the box a soft-key keyboard appears on screen which has either an "Enter" button or "Next" Button as an Action key.
I want the keyboard to have both, "Enter" as well as "Next" Button and also the comma(,) button.
I have searched throughout the web. They only have options to specify the "android:imeOptions" tag. But this option does not give the desired output as I need.
Kindly help.
PS: I do not want to create a custom keyboard. Just want to modify the existing soft-key keyboard to be displayed.
Also, I am working on Android v2.2
Thanks for your help.
I want the keyboard to have both, "Enter" as well as "Next" Button and also the comma(,) button.
There is, at most, one action key for an input method editor (a.k.a., soft keyboard). You cannot have two. Depending on the input method editor, you may have zero, as the input method editor is not obligated to show an action key.
I have a webform that is integrated into a native app via a webview. But now when the user sets the focus on the first textbox of the form, I see a Go button on the soft keyboard. Instead, I'd like to have Next button, clicking on which would take me to the next input control. And the last input control alone should have Go button on keyboard. How do I achieve this? (Note: Please note that I want this on a web form. I've already found material on how to do this on a native form.)
Please go to take a look, is that what you are looking for?
How to change the Android softkey keyboard "Go" button to "Next"
I'm attempting to replicate on android an iphone app my company had developed externally.
My need is simple but it seems hard to achieve under android. I have three numeric edittext inputs. Each should take only decimal numeric values. So numbers 0-9 and "." or ",". On the iphone this was achieved by a slide in calculator style keypad with one of the buttons a "GO" button that when pressed hides the keypad and, if all the inputs have valid values triggers a calculation that displays values on the screen.
I've tried the android phone input type and this is very close to what I want but I have no idea how to replicate the go button. I have put a calculate button on the main interface itself but I can't get the keyboard to go again once it is opened.
So can I either
A. Modify the layout of the phone keypad in some way to change one of the buttons to be
GO (Calculate) and intercept the keypress or
B. Do I have to create my own keypad in which case how do I go about sliding it in and out
over the top of the current view?
thanks guys
See android:imeActionId and android:imeActionLabel for your GO button.
Is there any way out for mapping the Done button to the button on the screen in Android. What I want is that I have one login screen user enters username and presses the next button on the soft keyboard which brings the focus on password field. AFter entering password when the user presses done button then the action which is performed on login button should be called.
Let me know if this is possible.
In your layout file, you can specify the focus order using attributes like nextFocusDown. If you have the focus order configured properly, hitting next should automatically take you to the next focusable element.
You can also add a KeyListener to the edit text to listen for the next key and set the focus accordingly.