How to validate a decimal value input?

Question

Currently working on only decimal values where in the text field user enter only deciaml value. Should accept only 10 numbers for example if user enter 12345.000000 it should get an alert says Number field format error. Please re-enter using the proper format. (6.3)

With my current jquery code it will accept decimal value

$("#txtQty").keyup(function() {
var $this = $(this);
$this.val($this.val().replace(/[^\d.]/g, ''));        
});

This is my html code for the text box with this html it will allow only 10 character

<input id="txtQty" type="text" maxlength="10"/>

I tired the below SO user told but still I am getting the same issue

   $('#txtQty').focusout(function(e) {
   if('123456.789'.match(/^[0-9]{6}\.[0-9]{3}$/) !== null){
      alert("Number field format error. Please re-enter using the proper format. (6.3)");  
   }else{
       '123456.7890'.match(/^[0-9]{6}\.[0-9]{3}$/) !== null
   }
});

before decimal point it has to accept (1-6) 6 number after decimal point it has to accept 3 only zero's if wrongly typed it should throw an alert not at all working still not getting that

Here is the fiddle link for the same

123456.000 -- true
12345.000 -- true
1234.000 -- true
123.000 -- true
12.000 -- true
1.000 -- true

Thanks in advance

$('.ipt_Havg').focusout(function (e) {
var regexp = /\d*\.\d{3}/
if (document.getElementById("ipt_Havg").value !== regexp) {
    alert("Number field format error. Please re-enter using the proper format. (6.3)");
} else {
    alert('nothing wrong here');
}
});

Answer 1

1) Your if/else is broken...

if('123456.789'.match(/^[0-9]{6}\.[0-9]{3}$/) !== null){
   alert("Number field format error. Please re-enter using the proper format. (6.3)");  
}else{
   '123456.7890'.match(/^[0-9]{6}\.[0-9]{3}$/) !== null // <- comparison makes no sense here
}

You are incorrectly using a comparison operator in place of a "statement" within the else . The else needs to contain a "statement" (something to do) not another comparison operator.

See: MDN "if...else" documentation

If some condition is true then do something, otherwise do something else.

if ('123456.789'.match(/^[0-9]{6}\.[0-9]{3}$/) !== null) {
   alert("Number field format error. Please re-enter using the proper format. (6.3)");  
} else {
   alert('nothing wrong here');
}

---

2) NOTE : I previously thought this was too obvious to even mention, however, you've hard coded '123456.789' into the conditional. In other words, it will never matter what value gets entered into your form...

'123456.789'.match(/^[0-9]{6}\\.[0-9]{3}$/) is always going to be true since '123456.789' is the only value being used here.

Otherwise, use the value of the field...

$('#ipt_Havg').val().match(/\d*\.\d{3}/) !== null

---

3) Your logic was also backwards.

if ($('#ipt_Havg').val().match(/\d*\.\d{3}/) !== null) {
    alert('nothing wrong here');
} else {
    alert("Number field format error. Please re-enter using the proper format. (6.3)");
}

DEMO: http://jsfiddle.net/wfzv0h5y/

---

4) Incorrect regex...

but one small mistake in the end it has to accept only three zero not more than tht but now if i enter 1234.0000 still it was accepting

Your regex also needed fixing...

^\d{1,6}\.0{3}$

---

DEMO: http://jsfiddle.net/wfzv0h5y/6/

Answer 2

JQuery Number Formatter Plugin is a good alternative in your situation.

https://github.com/andrewgp/jsNumberFormatter

You can check your input through this and validate the way you want.

Answer 3

You could use HTML5 input number:

<input type='number' step='0.001' max="999999.999" />

The step= sets the decimal places, the max= guarantees the other side.

Answer 4

You can specify repetitions in RegExps:

'123456.789'.match(/^[0-9]{6}\.[0-9]{3}$/) !== null
true
'123456.7890'.match(/^[0-9]{6}\.[0-9]{3}$/) !== null
false