Menu
I would like to force the user to type their age. I also would like to make sure they only enter between 18-99. Is that possible with HTML5 attributes like required, pattern, min and max? Seems like it is not working
<form>
<input type="number" name="Q2age" id="Q2age" size="10" min="18" max="99" pattern="[1-8][0-9]" required>
<button type="submit" class="button" id="test">Submit</button>
</form>
Am I doing something wrong here? I use Firefox 22.0 on Ubuntu 12.0.4LTS (tested on Chrome as well, but doesn't work.) Thank you for your help.
317
You can specify the min and max attributes, which will allow input only within a specific range. This only works for the spinner control buttons, however. Although the user may be able to type a number greater than the allowed max , the form will not submit.
The min attribute specifies the minimum value for an <input> element. Tip: Use the min attribute together with the max attribute to create a range of legal values. Note: The max and min attributes works with the following input types: number, range, date, datetime-local, month, time and week.
This is the expected behaviour because FF21 doesnt supports min,max attribute...
you can check it in http://html5test.com/
Check the screenshot
163
Your code works fine. Check this fiddle (I'm using latest chrome)
My only concern you is your pattern="[1-8][0-9]" can simple use this
pattern="[0-9]{2}"
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
