Numeric input for textarea in mobile browser

Question

I am writing a web interface for mobile devices. And I want to restrict input in the textarea: numbers 0-9, space, enter. I would like to see the default numeric keypad for textarea. But for textarea by default standard keyboard is showing. If I use virtual keyboard (simple buttons and javascript) standard keyboard still shows. How to disable the standard keyboard for textarea or set default numeric keypad?

If I get your question right then this pretty much solves it: http://stackoverflow.com/questions/10611833/how-to-disable-keypad-popup-when-on-edittext — Schnodderbalken, Nov 25 '13 at 14:45
@DevlshOne I'm developing a web interface for mobile browser — Andy, Nov 25 '13 at 14:53

score 3 · Answer 1 · edited Aug 09 '20 at 19:06

3

You can use the global attribute inputmode in textarea. This will open the numeric keyboard in Android and iPhone. Other keyboard variations are available such as tel (phone pad), email, and url.

<textarea inputmode="numeric">
</textarea>

See the MDN docs on inputmode for more.

edited Aug 09 '20 at 19:06

Coder-256

5,212
2
23
51

answered Aug 09 '20 at 18:15

Adam Combs

31
4

score -1 · Answer 2 · answered Nov 25 '13 at 14:57

-1

setRawInputType(InputType.TYPE_CLASS_NUMBER);

answered Nov 25 '13 at 14:57

DevlshOne

8,357
1
29
37

is it for html pages? – Andy Nov 25 '13 at 15:01
It is for Android HTML page serves, yes. – DevlshOne Nov 25 '13 at 15:03
My application runs on a web server, on a mobile device I am using only a browser. How can I use your code? – Andy Nov 25 '13 at 15:08

score -1 · Answer 3 · answered Nov 26 '13 at 09:09

-1

You must set the Input Type to "number". The number type is used for input fields that should contain a numeric value. You can also set restrictions on what numbers are accepted.

Example: Define a numeric field (with restrictions): Quantity (between 1 and 5):

<input type="number" name="quantity" min="1" max="5">

Use the following attributes to specify restrictions:

max - specifies the maximum value allowed
min - specifies the minimum value allowed
step - specifies the legal number intervals
value - Specifies the default value

answered Nov 26 '13 at 09:09

Manuel Taber

427
5
19

If you use a virtual keyboard you can use preventDefault() on the textarea to prevent opening the default keyboard – Manuel Taber Nov 26 '13 at 13:08
I try use code: $(textarea_id).insertAtCaret(txt); event.preventDefault(); but standard keyboard is showing – Andy Nov 26 '13 at 13:21

score -1 · Answer 4 · answered Apr 08 '14 at 11:45

<EditText
    android:id="@+id/launch_codes"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:hint="@string/enter_launch_codes"
    android:inputType="number"
    android:imeActionLabel="@string/launch" />

use the input type number in order to see the default numeric keypad

score -2 · Answer 5 · answered Nov 25 '13 at 14:45

-2

Use the android:inputType option.

In the xml layout file, you can define your textarea like this :

<EditText
    android:id=yourID
    android:inputType="phone" >
</EditText>

answered Nov 25 '13 at 14:45

eduine

147
2
12

2

Isn't that for an Android app and not a HTML page? – epascarello Nov 25 '13 at 14:46
That's the way i use it in my android app. – eduine Nov 25 '13 at 15:20
And is your Android app loaded in an HTML page off the web? – epascarello Nov 25 '13 at 15:34
No, it's just a basic android app, i didn't understood Andy's question well i think. He's talking about html textboxes. – eduine Nov 26 '13 at 09:08

Numeric input for textarea in mobile browser

5 Answers5