Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Samsung Galaxy Tablet does not allow entering floating point numbers to inputs with "number" type

Our client wants us to display numeric keyboard for an input field so basically I created a field like:

<input type="number" name="quantity" step=".01" value="0.00" />

However, Galaxy Tablet erases "." and merges numbers before and after it, also disables "." in the keyboard.

Is there another way to solve this issue or display numeric keyboard in input field when using type="text"?

Note: I tried using pattern attribute (which works on iPhone). I tested this issue on various Android devices with Android 2.1+. I did not encounter this error on any other HTC and Samsung devices.

like image 634
Korhan Avatar asked Jun 21 '12 09:06

Korhan


1 Answers

Yes, there is another way.

  1. Way 1: don't use type="number" but use type="text"
  2. Way 2: Apply way 1 for only Android phones. Detect User-Agent etc.
  3. Way 3: Apply way 1 for only broken implementations. See: What models of Samsung smartphones have missing period for html5 input type="number"?
  4. Way 4: Use type="tel"' for only Android or broken. (can't use on iPhone as no period then)
  5. Way 5: use type="text" and then javascript with custom behavior. See:

Period always shows: http://jsbin.com/heqeduyi/1/

Period shows once 3 digits: http://jsbin.com/yinaweho/1

like image 181
maxweber Avatar answered Oct 03 '22 02:10

maxweber