-2

I checked the answers to this question here and the best answer I found was this one since it doesn't allow to enter anything but numbers on the input field

function forceNumeric(){
    var $input = $(this);
    $input.val($input.val().replace(/[^\d]+/g,''));
}
$('body').on('propertychange input', 'input[type="number"]', forceNumeric);

The thing is that I need something like this but that it works for numbers with decimals. Right now this code prevents me from entering dots or commas so I can't enter decimal numbers. Any idea how to adapt it?

Community
  • 1
  • 1
Atirag
  • 1,660
  • 7
  • 32
  • 60
  • Just add dot/comma into character class: `/[^\d.,]+/g` – hindmost Sep 04 '16 at 13:40
  • 1
    Simple, use `/[^\d,.]+/g` I think some research might have helped you and will do for future use. Look up Regular expression / regex and you will find documentation on how to use it. https://en.wikipedia.org/wiki/Regular_expression – NewToJS Sep 04 '16 at 13:42
  • simple answer is, you can't. even using your regex, if you were to add `.` to the regex, you would *still* have to validate your input, because `12.3.45` isn't a number. use the well formed and established `numeric` input box, and validate your input, like millions of other programs/sites/scripts. – Claies Sep 04 '16 at 14:38
  • also, the answers here and the comments are mostly a repeat of that popular question you posted, so I'm not sure how much use this question has for the site; it's likely to be flagged as a duplicate of the question you referenced anyway. – Claies Sep 04 '16 at 14:40
  • @Claies I managed to do it. I will add my solution as an answer. – Atirag Sep 04 '16 at 15:14

2 Answers2

1
  • Adjust your regexp to accept commas/dots:

    /[^\d\.,]+/g

  • You are already using type=number which does the validation for you. Why do you even care about additional validation that does exactly the same thing as the native browser implementation?

mdziekon
  • 3,531
  • 3
  • 22
  • 32
  • Because if I use the type=number alone it allows the user to enter text on the input field and the validation is done afterwards while I want it to block the input of text completely. – Atirag Sep 04 '16 at 13:46
  • In that case, you have more cases than just replacing "non-numerical" characters from the input. Eg. ``1.000.1`` is not a valid number, but your simple regexp will allow it. – mdziekon Sep 04 '16 at 13:49
  • Do you know how to do that? – Atirag Sep 04 '16 at 13:59
  • No, I don't, as it is a rather complicated task. But a simple ``Number.isNaN(Number(your_input))`` should do the trick most of the times. – mdziekon Sep 04 '16 at 14:06
  • I tried that but it will not work really well because of the reasons stated here http://stackoverflow.com/questions/25176459/is-number-isnan-more-broken-than-isnan – Atirag Sep 04 '16 at 16:39
  • Well, I've already told you: "it is a rather complicated task". – mdziekon Sep 04 '16 at 18:05
0

I managed to make it work by changing the type of input field from number to text and using this

function forceNumericDecimal(){
    var $input = $(this);
    $input.val($input.val().replace(',', '.'));
    $input.val($input.val().replace(/[^\d\.]+/g,''));
    $input.val($input.val().replace(/\./, "x"));
    $input.val($input.val().replace(/\./g, ""));
    $input.val($input.val().replace(/x/, "."));
}

$('body').on('propertychange input', '.numberdecimal', forceNumericDecimal);

The regex replacements will change commas for dots and will not allow more than one dot.

Atirag
  • 1,660
  • 7
  • 32
  • 60
  • please note that this isn't a "JavaScript" solution, it is a solution that relies upon jQuery events. – Claies Sep 04 '16 at 23:43