HTML Number Input removes decimal point?

Question

I have a problem with the number input on a form. When I enter a number, say 88.2 and submit it, there are no problems. But when this other person does the same, you can see in the php code if you echo the variable from the number input, that it has removed the decimal point (.).

It does not remove his decimal point when he uses a comma however, when I use a comma it removes that for me. Is there any way to fix this and make it only accept "." as decimal point?

Here's the input:

<input id="version" name="version" step="0.1" min="1.0" max="250.0" type="number" class="input-small" placeholder="87.2"></input>

There is nothing in the PHP code that's unusual, only

echo $_POST['version'];

input-small css:

.input-small {
  width: 90px;
}

Solution 1

Support to <input type=number> is still very limited, incomplete, and buggy.

For example, there is no support on IE 10 and Firefox 19. On them, the element falls back to an <input type=text> element, which means that any string is accepted as input and passed to the server as such, with no checking.

On browsers that support it, such as Chrome, the behavior varies, and is expected to vary, since the HTML5 CR definition intentionally leaves it open: the browser is required to provide a widget for numeric input somehow and guarantee that the data eventually sent to the server is correct as per the attributes of the element (within the given range, etc.).

In practice, the implementation depends on the locale of the browser, and you cannot control that as an author. This means that a browser might accept 88.2, or it might accept 88,2 (and internally convert it to 88.2), or it might accept both, or it might, in principle, accept input in hieroglyphs only (and internally convert it to the canonical form). It might even parse the user input so that any extra characters are just discarded, which means that 88FOO as well as 88.2 might be truncated to 88 when comma is the decimal separator.

What happens in your case is difficult to decide, since the browsers and platforms have not been described, and it is unclear what the server gets. But the important thing is that <input type=number> cannot be relied on, at all. It can be used in a controlled environment where everyone uses the same version of the same browser in the same operating system, up to and including language version and locale settings. Otherwise, use <input type=text> for numeric input and parse the input server-side and optionally pre-check it client-side, and make sure you inform the user of the expected format of input (such as decimal comma vs. decimal point).

Solution 2

type='number' step='any' may solve the issue.

http://dev.w3.org/html5/markup/input.number.html