HTML5 supports a number of new field types, especially for <input> like date, number, email which will support mobile users to be displayed with a customized editor for certain fields (like numbers for number fields and date picker for date fields)

input[type=”number”]

Will give an input field, which only allows numbers or decimals. On supporting browsers a custom touch input or up/down keys are shown.

Good to know1

  • [pattern] is not supported by number fields
  • Chrome does not allow usage of invalid decimal signs
  • Firefox does allow usage of invalid decimal signs, but will not return non valid values on submit!
  • Firefox (?) takes page language into account when deciding which decimal signs are valid ([lang=”de”] only accepts “,”, while [lang=”de-ch”] accepts “,” and “.”)
  • For Firefox, setting [lang=”x”] has the same effect as when setting on <html> (e.g. allowing “,” and “.” when set to [lang=”de-ch”])
  • It’s not possible to get the “raw” user input from the field
  1. https://ctrl.blog/entry/html5-input-number-localization []

Hinterlasse eine Antwort

Deine E-Mail-Adresse wird nicht veröffentlicht.