0

I'm working with an input field of type number, and I need to stay with this field type (using a text field is not an option).

The number field blocks most non-numeric characters, the exception being characters like ., -, and +. The field I am working with is only for non-negative integers, so I'm trying to block these by attaching an onkeypress handler, for example:

$('input[type="number"]').on('keypress', function (ev) {
    if (/* keyCode in list of undesired chars */) {
        return false; // preventing character from being added
    }
}

Is there a definitive list of what characters are permitted, or would I have more luck just enumerating the keycodes which the field does support?

I am aware of solutions like jquery.numeric but would prefer not to add another dependency.

MattDs17
  • 549
  • 1
  • 3
  • 19
  • 3
    If you only want 0 and up, use the `min` attribute: `` – David says reinstate Monica Aug 17 '16 at 13:41
  • I think that works for stepping and validation, but it doesn't do any input blocking on the undesired characters. – MattDs17 Aug 17 '16 at 13:46
  • since the keycodes you want are just [0-9] checking against them is probably easier – BIU Aug 17 '16 at 13:49
  • 1
    If I had to guess which other characters may be accepted as part of numbers under specific circumstances, I'd say: `e/E` for scientific notation (as in 2.6e-17, which btw is a positive number), `0x/0X/0b/0B` for binary, `o/O` for octal, `h/H` for hexadecimal, and comma seperators (as in 1,000,000). – m69 ''snarky and unwelcoming'' Aug 17 '16 at 13:50
  • 2
    @m69 just tried, of those only e was accepted – BIU Aug 17 '16 at 13:51
  • @BIU with that, I'm concerned about keycodes for control keys like backspace, arrow keys, etc. As far as I'm aware it's not uniform across all browsers. – MattDs17 Aug 17 '16 at 13:52
  • @m69 good catch, I didn't consider those. But even then, is behaviour uniform across locales/languages? – MattDs17 Aug 17 '16 at 13:55
  • can you use the HTML5 pattern attribute? or is that only validation? – BIU Aug 17 '16 at 13:56
  • @BIU unfortunately, it's for validation as well – MattDs17 Aug 17 '16 at 13:57
  • you could validate the field content itself on change - check that the new value is [0-9] and if not, reset to old value - apparently you can store the old value with .data() - http://stackoverflow.com/questions/29118178/input-jquery-get-old-value-before-onchange-and-get-value-after-on-change – BIU Aug 17 '16 at 14:00
  • though i guess with continuous typing that's also not great :/ – BIU Aug 17 '16 at 14:01
  • 2
    This: http://www.w3.org/TR/html-markup/input.number.html says the value of type=number is a float, which is then defined as an (optional) minus, some digits, an (optional) decimal point, some (optional) digits, an (optional) e or E, an (optional) minus or plus and some more (optional) digits. – m69 ''snarky and unwelcoming'' Aug 17 '16 at 14:03
  • @m69 that's exactly what I was looking for, thanks. Though I'm a little surprised that '.' is the standard decimal separator when ',' is used in many countries. – MattDs17 Aug 17 '16 at 14:07
  • I guess accepting both dots and commas as decimal signs would lead to confusion with the grouping sign. – m69 ''snarky and unwelcoming'' Aug 17 '16 at 14:15

0 Answers0