HTML: Why does Android browser show "Go" instead of "Next" in keyboard? -
i have html login form contains following elements (in order):
input type=text(user name input)input type=password(password)input type=submit(login button)
why android browser show "go" button in soft keyboard instead of "next" button when focus in text input? causes user fail login because after entering user name, user presses bottom right button in keyboard (usually correct action) , form submitted empty password, not going work. [this behavior make sense in case browser set remember passwords , password manager able fill in password. however, not case here can test below.]
i'd have input type text have "next" button , input type password (the last input before submit) have "go" button.
an example of problematic form @ https://peda.net/:login (this form contains code detect "enter" key input , prevents submitting form unless last visible form input focused).
do know real fix issue? know if implementing native application, i'd use android:imeoptions="actionnext" (see how change android softkey keyboard "go" button "next"). however, in case it's html form , android default browser.
the problem visible @ least following configurations:
- "browser" system app running on android 2.3.4 (cyanogenmod 7)
- "browser" system app running on android 4.2.2 (cyanogenmod 10.1)
- "browser" system app running on android 4.3.1 (cyanogenmod 10.2 m1)
- "browser" system app (aosp browser) running on android 4.4.2 (cyanogenmod 11.0 m3)
- "browser" system app (aosp browser) running on android 5.5.1 (cyanogenmod 12.1) [has arrow icon instead of word "go"]
- "browser" system app (aosp browser) running on android 6.0.1 (cyanogenmod 13.0) [has arrow icon instead of word "go"]
the android browser displays go input fields because forms on web (especially search boxes) have no submit button, , can activated pressing enter (go equivalent enter).
instead versions of android show tab key in bottom right of keyboard facilitate navigating between form fields.
i don't think can prevent either of these behaviours.
two possible workarounds:
use javascript ignore submission of login form until both inputs non-blank:
<form name="loginform" onsubmit="return document.loginform.user.value != '' && document.loginform.pass.value != ''"> <input type="text" name="user"> <input type="password" name="pass"> <input type="submit" value="login"> </form>the cleanest solution set both inputs required using new html5 required attribute - but android browser doesn't support yet. approach supplement required attribute javascript fallback such described csskarma.
Comments
Post a Comment