Javascript validation on Floating values

Question

How to do decimal validation using javascript?

There is a text box which should accept only 24.00 or 24 or any value less than 24.00. The text box also must allow if 23.99 is entered.

I tried it this way:

if (document.forms[0].hours!= undefined) {
    var val = document.forms[0].hours.value;
    if (val .match(/^\d{0,6}(?:\.\d{0,2})?$/)) {
        alert("Invalid" +'${payType}'+"  Hours. The hours entered can not have more than 2 decimal places or should be in the range of 0 to 24 ");
        submitted=false;           
        return false;
    }
}

The values can be: 1.00 or 12.25 or 1.25 or 23.99 or 24 but not above these values. Any number below 24.00 or 24.

Answer 1

If you prefer doing it with regex try this

^(0+)?(24(\.00?)?|(\.00?)?|\.[0-9]+|0?[0-9](\.[0-9]{0,2})?|(0+)?[0-2][0-3](\.[0-9][0-9]?)?)$

Tested on all the values below

   0.0
  4.00
  4.01
024.0
  5.8
  2.95
 10.5
 10.00
023.9
011
 09.89
 09
  8.67
 24
 24.00
 24.0
 23.99
  0.00
  0
   .5
   .55
  6
 24.01  // fail
 13.90
 78.23  // fail
  1.56
  0.06
 25.00  // fail
 23.99
 41.00  // fail

Demo

---

The section below isn't related to the answer but rather to the comments below. @Anto these are just a few of online resources on regex. Have fun ;)

---

Free online books (google for these books)

• Mastering Regular Expressions, 3rdEdition
• Introducing Regular Expressions
• Regular Expression Pocket Reference, 2nd Edition
• Regular Expressions Cookbook

Good websites

• http://www.regular-expressions.info
• http://www.rexegg.com
• http://regexlib.com
• http://overapi.com/regex/

Online regex tester

• http://regex101.com/

Answer 2

You could try the below regex,

^(?:24\.00|24|(?:[0][1-9]|[1][0-9]|2[0-3])\.[0-9][0-9])$

DEMO

OR

If you don't want 0 before the digit then you could try the below

^(?:24\.00|24|(?:[1-9]|[1][0-9]|2[0-3])\.[0-9][0-9])$

DEMO

Answer 3

you can reverse thinking

allow any number above 24.00 or 24

var reg = /^(24\.(0[1-9]|[1-9]\d?)|([3-9]\d|[^0]\d{2,9}|2[5-9])(\.\d{1,2})?)$/

     3.33     fail
    23.00     ...
    24        ...
    24.00     ...
     0.00     ...
     0        ...
    24.01     pass
    34.01     ...
    34        ...
   120.18     ...

if (document.forms[0].hours!= undefined) {
    var val = document.forms[0].hours.value;
    if (!reg.test(val)) {
        alert("Invalid" +'${payType}'+"  Hours. The hours entered can not have more than 2 decimal places or should be in the range of 0 to 24 ");
        submitted=false;           
        return false;
    }
}

Answer 4

You don't need regular expression for this at all. In fact it would be a lot simpler to just do this:

if (document.forms[0].hours!= undefined) {
    var val = parseFloat(document.forms[0].hours.value);

    // Get the number of decimals
    var a = val.toString().split(".");
    var decimals = a.length > 1 ? a[1].length : 0;

    if (isNaN(val) || val < 0 || val > 24 || decimals > 2) {
        alert("Invalid" +'${payType}'+"  Hours. The hours entered can not have more than 2 decimal places or should be in the range of 0 to 24 ");
        submitted=false;           
        return false;
    }
}