How to force keyboard with symbols in mobile website in Android - android

I have a mobile website and it has some HTML input elements in it, like this:
<input type="number"/>
I have made the site viewable by an Android application.
Is it possible to get the keyboard with symbols instead of the default one with letters when this HTML input element is focused?
It works with IOs using type="number" but on android it shows just a number pad.

The only input you can control reliably is your own. If you want to ensure that there is a keyboard with the right symbols you can:
Specify no inputType (the default keyboard usually has all supported characters)
Create an in-website keyboard.
I dealt with the same problem in the past. We finally settled on the first solution in combination with custom input validation. But none of them are actually good.

Related

PhoneGap in Android: Inputs do not move with soft keyboard

I am helping to style a Banking mobile app, and the company is using PhoneGap to build across all platforms. I am using a Nexus 4 (android) to test the app, and have noticed that when input fields are tapped, the screen does not scroll up with the soft keyboard - many input fields get lost behind the keyboard.
I can NOT have the addressbar at the top of the screen show, so the one fix I found that said to change the xml file fullscreen preference won't work.
How can this be fixed? I have not been able to test on other devices yet.
The plugin suggested in the comments worked.

Android soft keyboard obscures input fields in mobile HTML5 web app

I am writing a mobile HTML5 web application to run on both Apple and Android. On the Android device I am testing on, I am having the following issue:
I have an input web control text box located in the lower 50% of the screen. When the focus goes to the text box, the soft keyboard is displayed and obscures/covers up/hides the input web control for which the user is supposed to be typing into. Only when the user types in at least one character does the input web control become visible and no longer hidden underneath the keyboard.
What I want is for the field being entered NOT to be obscured by the keyboard. When the soft keyboard is displayed, I want the input web control to remain visible.
This is on a Samsung tablet running Android version 3.2.
Please tell me how to accomplish this.
The simplest way to solve this android (and now ios7 too) nasty is to use the inputs focus and blur events. if you don't have a footer tag change to a class.
In jQuery:
$("input").focus(function(){
$('footer').hide();
});
$("input").blur(function(){
$('footer').show();
});

type="number" on webview doesn't show numeric keyboard

I have a webview with input fields with attribute type="number", according to docs this should open numeric keyboard. I just get qwerty like with the rest of fields.
Does this need additional development effort? Or is it the device maybe? (I'm using Galaxy S2, Android 4.0)?
My experience on keyboards is about a year old, but back then webview didn't report those fields as numbers to the IME, it reported them as web fields. Which were treated as text. The only ones it reported as a different type were passwords.

Force android to display email type keyboard in HTML5 page based web application

I have designed an HTML5 page which consists of a input box of type email. This HTML5 page will be displayed in Android application in a webview.
<input type="email" autofocus id="emailid"/>
The problem I'm facing is that Android doesn't show the email type keyboard which has the "#" and ".com" symbol by default.
How to force Android to display email type keyboard using any of these?
Thanks in advance :)
Currently, HTML5 is not fully supported on devices running 2.2 or below.
These are not supported:
input type=search
input type=tel
input type=url
input type=email
input type=datetime
input type=date
input type=month
input type=week
input type=time
input type=datetime-local
input type=range
input type=color
input type=checkbox
input type=image
textarea
select
datalist
keygen
output
progress
field validation
form validation
APIs
Spellcheck attribute
Session history
Geolocation
Device Orientation
FileReader API
Local Storage
Access the camera
Full Screen
And the confirmation: http://www.petefreitag.com/item/768.cfm
Try running your app on ICS or JB and it should work.
Try to detect version of Android OS on server and to the next:
1) if OS = ICS or above => use native html 5
2) if OS < ICS => show custom html keyboard
Also for OS < ICS in your app disable soft keyboard.
Keyboards are completely pluggable in Android - and therefore somewhat unpredictable. Device manufacturers almost always ship a custom keyboard (which can introduce problems, For example: I've seen some HTC keyboards not handle IME_ACTIONS). Also, users are free to download and use many different keyboards from the Play Store. Certain keyboards may not have an email style - maybe because the developers didn't think of it, or maybe because it's not appropriate. For instance: Something like Graffiti keyboard might legitimately ignore the email style completely?
I believe the best you can do is handle the cases that are supported. If >=ICS supports the input type="email" and older versions don't, at least over time your user base should shift towards a higher percentage of users getting the behavior you want.
I don't know what your app looks like, but another option if you really want the # sign and .com keys to be visible would be to use a hybrid approach where you add only those keys to your html and allow users to tap those or use the normal pluggable Android keyboard for everything else (or # signs and .com's also - if their keyboards include it)

Soft-keyboard type in a custom HTML page

Is there any way to specify which soft keyboard layout (I need only numbers) is shown when the user taps on a text input field in an HTML page?
I can change the HTML page and the Javacode (I have an activity embedding a WebView). However, it must not affect other platforms if I change the HTML code (another browser/device should still interpret the input field properly and show a soft keyboard, not necessarly a numbers only keyboard)
I did not try this, but in theory it should work:
Use the HTML5 type attribute for the <input> tag to declare the field as accepting only numbers. This will give the browser the hint to display a numeric keyboard. To have this only take effect on Android devices, consider emitting some Android-specific Javascript (which could either do the platform detection on the client through the user agent or which could alternatively only be sent by the server if that detects and Android device - again using the user agent header), which traverses through all input elements (maybe marked with a special class) and sets the type to number.
They seem to work differently in different devices and OS versions. It basically depends on the WebKit version that runs on a device. If it supports those tags, it will work, else, it ignores that tag.
On 2.3.4, on My Nexus S, type = number, gives a numeric keypad.
I've also seen that adding ' pattern="[0-9]*" ' to your input tag. Try:
<input type="number" size="4" maxlength="4" pattern="[0-9]*" ></input>

Categories

Resources