JavaScript Decimal Limit with RegEx

I have some client-side validation in a text box that resolves numbers up to two decimal places without another input.

This script was the base for entering numeric values, but it needs to be adapted so that it can accept a decimal point, followed only by two decimal places.

I tried things like /[^\d].\d{0,2} , but then replacing the call did not work, and I have no idea how to do this.

the code

 <script type="text/JavaScript"> function valid(f) { if (!/^\d*$/.test(f.value)) { f.value = f.value.replace(/[^\d]/g,""); alert("Invalid number"); } } </script> 



Note

I need to match an empty string. If an empty string is provided and the form is submitted, the default value returns to zero.

+6
javascript regex
Jan 22 '09 at 10:46
source share
7 answers

. The character has special meaning in RegEx, therefore escaping is required.

 /^(?:\d*\.\d{1,2}|\d+)$/ 

This corresponds to 123.45, 123.4, 123 and .2, .24, but not emtpy string, 123., 123.456

+12
Jan 22 '09 at 10:57
source share

. means in RegEx: any character, you must put a backslash. \.

That would be better:

 /^\d+(\.\d{0,2})?$/ 

I am included in the composition of the parts:

  • You need at least 1 number before the dot. If you do not want this, replace + with * , but then empty lines will also be matched.
  • If you have decimal values, you need a dot in front.
  • After the number there should be nothing, $ means the end of the input.

and for the replacement part you must also specify a point

 f.value.replace(/[^\d\.]/g, "") 

Edit:

If this is for live input verification, why don't you just intercept key events and check their authenticity (by creating a line in memory) or just delete the last character in the field?

+5
Jan 22 '09 at 10:59
source share

Do you really want to do this with regex?

 function valid(f) { if(isNaN(f)){return false;} return 100 * f == parseInt(100*f,10); } 
+2
Jan 22 '09 at 11:54
source share

gs: This is very close, but the line

 f.value = f.value.replace(/[^\d\.]/g, ""); 

Really does not work. For some reason, I lose focus on the text field. Although maybe this is my code;)

+1
Jan 22 '09 at 11:32
source share

If we need to check the numerical value in the text box where we want to prevent more than one decimal place (for example, 2..3, .2, etc.)

Below is the Javascript function for this.

  if (MoreThanOnePoint(document.getElementById("txtNoofHrs").value) == false) { alert("Please enter one decimal only"); document.forms[0].txtNoofHrs.focus(); return false; } function MoreThanOnePoint(strString) { var strChar; var blnResult = true; var varcount = 0; for (i = 0; i < strString.length && blnResult == true; i++) { if (strString.charAt(i) == ".") { varcount++; if (varcount > 1) { //alert("Please enter one decimal only"); blnResult = false; } } } return blnResult; } 
0
Aug 24 2018-11-12T00:
source share

You can use javascript function instead of regex

 function IsValid(value) { var split = value.split('.'); if (split.length != 2) { return false; } else if (split[1].length > 2 || !Number(split[1])) { return false; } else if (!(split[0] == '' || split[0] == '0')) { return false; } return true; } 
0
Mar 22 '13 at 16:24
source share

Regex

 /^\d+(\.\d{1,2})?$/ 



Javascript

 function valid(f) { if(!f.value) { // Test if text field is empty f.value = 0; // Initialize value to 0 console.log("Valid number"); // Let user know input is OK } else if (!/^\d+(\.\d{1,2})?$/.test(f.value)) { // Test regex f.value = ""; // Empty the text box console.error("invalid number"); // Let user know input is not OK } else { console.log("Valid number"); // Let user know input is OK } } document.getElementById("testbutton").addEventListener( // Add event listener to button "click", valid.bind( // Bind the text field to the `value` function this, document.getElementById("testfield") ) ); 
 <input id="testfield" value="15.1" /> <button id="testbutton">Test expression</button> 



Description

  • / / : start and end of expression
  • ^ : everything that follows should be at the beginning of the line you are testing.
  • \d+ : there must be at least one digit
  • ( )? : this part is optional
  • \. : here comes the point
  • \d{1,2} : there must be one to five digits.
  • $ : everything that precedes this should be at the end of the line you are testing.



Tip

You can use regexr.com or regex101.com to check for regular expressions directly in the browser!

0
Feb 12 '18 at 10:11
source share



All Articles