Chrome/HTML5: Input type number not respecting max attribute?
It does work but you only see an error message (tooltip) if you put a submit button and a form into your code:
<form action="#" method="get"> <input type="number" max="99" /> <input type="submit" value="Submit!" /></form>
jsFiddle
It's an old question, but I didn't find any relevant answers for this question anywhere.this behaviour is still around in chrome (version 61).
I have found a little trick that can be used in some situation.it's relevant for those who use data-binding libraries like aurelia
, angular
etc.. I tested only on aurelia - but that should work also for others.
the trick relies on the fact that input of type range
enforce the min
/max
constraints.
we simply create another input (of type range
) that is bounded to the same value as the regular input, and we hide it via css
.
when the user inputs something that is greater than the max
value, it will snap back to the max
value.
here's a demo in aurelia: https://gist.run/?id=86fc278d3837718be4691acd5625aaad