0

Why doesn't the HTML 5 specification for the input type="number" control include support for the maxlength attribute?

Browsing Stack Overflow for questions matching search terms like input type number maxlength, it seems that there are quite a few web applications out there with a requirement to display a control that requires the user to input a number, but also constrains the input field to a particular maximum number of characters.

Judging from the Stack Overflow answers to these questions, it seems like the solution that most applications end up landing on is either using some manner of Javascript "hack" to limit the count of characters appearing in the control, or else to use a input type="text" control (with its longstanding support for the maxlength attribute) instead of the newer input type="number".

It seems like a cleaner solution for this common requirement would be to allow maxlength to work with input type="number" controls.

I understand that a particular max attribute value may not always correspond directly to a maxlength attribute value -- e.g. if the maximum number to be allowed in a control is something like 50 instead of 99 -- but apart from that, what is the reason that the HTML 5 specification does not include support for the maxlength attribute?

Community
  • 1
  • 1
Jon Schneider
  • 25,758
  • 23
  • 142
  • 170
  • Why not use the max attribute that input type="number" does offer? I see no situation where this is isn't going to work, when a 'maxlength' would. – SamHuckaby Nov 15 '13 at 14:04
  • trusting in the client side? good luck with that – jcho360 Nov 15 '13 at 14:05
  • @SamHuckaby The primary reason is a business requirement that for a form field designed to capture a positive integer with a maximum value that's two digits long (e.g. 50), the business is asking that users not be able to type into the field more than two characters, because that causes part of the entered value to disappear from view (in a narrow field). (Same as the behavior that the maxlength attribute provides.) – Jon Schneider Nov 15 '13 at 15:36
  • @jcho360 Obviously server-side validation of submitted values still needs to be performed, whatever client-side implementation ends up being used. – Jon Schneider Nov 18 '13 at 14:01

2 Answers2

1

Per the answer found here: https://stackoverflow.com/a/18510925/1507210

You could alternately use this syntax with a text field to get what you're looking for without the chance of introducing letters via the pattern field, which uses regex matching:

<input type="text" pattern="\d*" maxlength="4">

Though as I stated in my comment, I can see no reason you would ever want to restrict the length of a number that max would fail to solve the problem, and more gracefully.

An example would be, in a situation where your number control goes into the negative. Using a length attribute would break negative numbers because a number with a maxlength of 1 would not permit '-1' as it is two characters. By only allowing min and max, it prevents programmers who aren't thinking from writing code that will break as soon as someone tries to go into the negative numbers.

Community
  • 1
  • 1
SamHuckaby
  • 1,162
  • 1
  • 13
  • 35
  • One issue with this solution is that some browsers (e.g. Chrome) will display up/down toggle arrows as part of an input type="number" field that users can use to adjust the value using only the mouse. These toggle arrows aren't rendered in an input type="text" field. – Jon Schneider Nov 15 '13 at 15:38
  • This also helps illustrate one of the phenomena I mentioned in my original question above: For a form field designed to capture number input, why do solutions often involve ignoring the new HTML5 input type="number" element in favor of using the older input type="text"? – Jon Schneider Nov 15 '13 at 15:39
0

Because usually numeric values are converted to a specific type, integer for example. Signed integer is a 4 byte number and we know, what is max value and min value for this type, not max_length.

I think that's the reason.

marxin
  • 3,692
  • 3
  • 31
  • 44