input type=number keyboard has dot disabled in Galaxy Tab

Question

I know that there are many questions about that isssue already responded, but none of the solutions given has worked for me.

I'm developing a web for an enterprise that's using Samsung Galaxy Tab. There are lots of inputs which contents are decimal numbers. So I tried with <input type="number" />. But the navigator displays a keyboard with dot and comma disabled. Not only this, but onfocus, dot or comma separators are removed from the value.

I have already tried setting a step like "0,1", "0,01", "0.1", "0.01", "any", etc, tried min, max, pattern with a regex that matches decimal numbers... There are no advices in stackoverflow left to try, and this is terrible haha.

I'm using a Samsung Galaxy Tab 10.1 with default browser, but I haven't found any document talking about any limitation of it's html5 implementation. So nowadays I don't know if there is something I am missing, if there is something I can try, or if something knows that is Galaxy Tab's fault so I can do nothing for this.

Lots of thanks in advance.

Debbee

Have you tried installing Chrome on the tablet and using it to test the inputs? Installing Chrome and making it the default browser is the first thing I did on both of my Galaxy Tab 3 10.1 tablets. – Gradate

I know that would be a hard requirement for the target team, we are not talking about "please stop using IE", but about "you have a lead product but you must anyway avoi using default browser". Thanks for the advice anyway. We finally ended up developing a simple custom HTML numeric keyboard. – Barnstorm

See this as a problem on Samsung Galaxy S3. Seems to be a problem with the 'Samsung keyboard' app, rather than the AOSP browser or Chrome. – Kunin

If you really want to improve the UX, and be sure it's working as expected on multiple platforms. You may better implement your own keyboard layout (in div). – Whiggism

Answer 1

In android namespace you can use:

 android:inputType="numberDecimal"

Which enables you to input the "."

Mindy

Sorry, are you talking about andorid apps os web development? – Barnstorm

I'm talking about XML for android. I see that you're doing HTML5, but I assume that the input types are similar. Decimals would be a common requirement, so I cant believe that the Samsung implementation is invalid – Mindy

Samsung soft keyboard in the browser is indeed invalid. – Solus

Still fails on some devices. – Argentic

Answer 2

You need to extend your webview class and use its object like this

public class WebViewExtended extends WebView{

    public WebViewExtended(Context context) {
        super(context);
    }

    public WebViewExtended(Context context, AttributeSet attrs) {
        super(context, attrs);    
    }

    public WebViewExtended(Context context, AttributeSet attrs, int defStyle) {
        super(context, attrs, defStyle);
    }

    @Override
    public InputConnection onCreateInputConnection(EditorInfo outAttrs) {
        InputConnection connection = super.onCreateInputConnection(outAttrs);
        if ((outAttrs.inputType & InputType.TYPE_CLASS_NUMBER) == InputType.TYPE_CLASS_NUMBER)
        {
            outAttrs.inputType |= InputType.TYPE_NUMBER_FLAG_DECIMAL;
        }

        return connection;
    }

}

Finnie

The question is about HTML5 > I'm developing a web for an enterprise that's using Samsung Galaxy Tab. There are lots of inputs which contents are decimal numbers. So I tried with <input type="number" /> – Barnstorm

@ÁxelCostasPena This is how you are going to get a dot in you numeric keypad. As androids latest versions don't have it in webview by default. The changes are to be made on the back end(android side) – Finnie

Answer 3

The HTML5 specification for input with a type of number states that any string that can be parsed as a valid floating point number should be allowed. That specifically includes . as well as -, + and e.

So the implementation on the Samsung Galaxy Tab 10.1 is invalid.

If you need to support this device, you may have to use type="text" and validate the string. This won't auto-pop the correct keyboard on devices that have software keyboards.

<input type="text" pattern="^-?(?:[0-9]+|[0-9]*\.[0-9]+)$" name="NumberInput">

Glyoxaline

you meant to say implementation of <input type="number" /> on Android stock browser is invalid? – Pyro

@Mithun, that's what I can't believe, that either the html5 input type=number for the native browser of a Samsung Galaxy Tab is buggy, or the soft keyboard is nota dapted to floating point numbers, where no one outside is talking about that. – Barnstorm

@Áxel Try a different soft keyword and confirm the reproducibility – Pyro

You mean in the Samsung Galaxy Tab settings? In input settings have options "Swype", "Samsung Keyboard", "Android Spanish keyboard", and "Google Voice", but this doesn't solve the problem. What do you suggest me to do? Create afiddle with different examples to other owners of Galaxy Tab could reproduce it? – Barnstorm

It's a problem with the Samsung soft keyboard. Have seen it on multiple Samsung devices, but mostly on Galaxy Tabs. – Solus