Search code examples
javascripthtmldecimalnumber-formattingparsefloat

Why does my textarea (HTML) value show 12,000,000.11 but after parseFloat the value is only 12?


I am attempting to develop a conversion website that takes a numeric value:

 1,200.12
 or
 1.200,12
 or
 1200.12
 or
 1200,12
 and have them all interpreted as 1200.12 by parseFloat.

 I would also like decimals to be able to be interpreted.
 0.123
 or
 0,123     
 as 0.123

through a textarea and then parseFloat the number in order to perform calculations. These are the results I am getting:

textarea input = 12,000.12
value after parseFloat = 12

Does parseFloat not recognize the formatting of the numbers? i get the same results with:

textarea input: 12.000,12
value after parseFloat = 12

How do I solve this problem? It would seem I need to strip out the commas since parseFloat doesn't read beyond them and with european notation strip the decimals and change the comma to a decimal for parseFloat to read the input correctly. Any ideas on how to solve this? My guess is I would need to identify the string input as either european or american decimal notation and then perform the required actions to prepare the string for parseFloat. How would I go about achieving that? All contributions are appreciated. Using HTML5 and Javascript. This is my first website so please go easy on me.

Best, RP

To all contributors...Thank you! So far all the input has been sweet. I don't think we are going to be able to use a single replace statement to correctly strip both european and american notation so I think I should use REGEX somehow to determine the notation and then split into an if else statement to perform separate replace functions on each individual notation.

var input, trim;
input = "1.234,56"   //string from textarea on page
if(/REGEX that determines American Notation/.test(input){ 
   trim =  input.replace(/\,/,"");//removes commas and leaves decimal point);
}
else(/REGEX that determine European Notation/.test(input)/){ //would qualify input here
   rep = input.replace(/\./,"");//removes all decimal points);
   trim = rep.replace(/\,/,"."//changes the remaining comma to a decimal);
}
//now either notation should be in the appropriate form to parse
number = parseFloat(trim);

Is this possible using REGEX? Please see my other question. Regex - creating an input/textarea that correctly interprets numbers


Solution

  • Here is a solution that uses a regular expression to eliminate all commas and all periods, except the last one.

    var number = "1,234.567.890";
    var replaced = number.replace(/,|\.(?=.*\.)/g, "");
    var result = parseFloat(replaced);
    // result === 1234567.89
    

    Alternatively, you can use this, which treats commas and periods identically, and ignores them all except for the last one.

    var number = "12.345,67";
    var replaced = number.replace(/[.,](?=.*[.,])/g, "").replace(",", ".");
    var result = parseFloat(replaced);
    // result === 12345.67