Javascript parse float is ignoring the decimals after my comma
-
30-01-2021 - |
Question
Here's a simple scenario. I want to show the subtraction of two values show on my site:
//Value on my websites HTML is: "75,00"
var fullcost = parseFloat($("#fullcost").text());
//Value on my websites HTML is: "0,03"
var auctioncost = parseFloat($("#auctioncost").text());
alert(fullcost); //Outputs: 75
alert(auctioncost); //Ouputs: 0
Can anyone tell me what I'm doing wrong?
La solution
This is "By Design". The parseFloat
function will only consider the parts of the string up until in reaches a non +, -, number, exponent or decimal point. Once it sees the comma it stops looking and only considers the "75" portion.
To fix this convert the commas to decimal points.
var fullcost = parseFloat($("#fullcost").text().replace(',', '.'));
Autres conseils
javascript's parseFloat doesn't take a locale parameter. So you will have to replace ,
with .
parseFloat('0,04'.replace(/,/, '.')); // 0.04
Why not use globalize? This is only one of the issues that you can run in to when you don't use the english language:
Globalize.parseFloat('0,04'); // 0.04
Some links on stackoverflow to look into:
parseFloat
parses according to the JavaScript definition of a decimal literal, not your locale's definition. (E.g., parseFloat
is not locale-aware.) Decimal literals in JavaScript use .
for the decimal point.
As @JaredPar pointed out in his answer use parseFloat
with replace
var fullcost = parseFloat($("#fullcost").text().replace(',', '.'));
Just replacing the comma
with a dot
will fix, Unless it's a number over the thousands like 1.000.000,00
this way will give you the wrong digit. So you need to replace the comma
remove the dots
.
// Remove all dot's. Replace the comma.
var fullcost = parseFloat($("#fullcost").text().replace(/\./g,'').replace(',', '.'));
By using two replaces you'll be able to deal with the data without receiving wrong digits in the output.
It is better to use this syntax to replace all the commas in a case of a million 1,234,567
var string = "1,234,567";
string = string.replace(/[^\d\.\-]/g, "");
var number = parseFloat(string);
console.log(number)
The g
means to remove all commas.
Check the Jsfiddle demo here.
Numbers in JS use a .
(full stop / period) character to indicate the decimal point not a ,
(comma).
For anyone arriving here wondering how to deal with this problem where commas (,
) and full stops (.
) might be involved but the exact number format may not be known - this is how I correct a string before using parseFloat()
(borrowing ideas from other answers):
function preformatFloat(float){
if(!float){
return '';
};
//Index of first comma
const posC = float.indexOf(',');
if(posC === -1){
//No commas found, treat as float
return float;
};
//Index of first full stop
const posFS = float.indexOf('.');
if(posFS === -1){
//Uses commas and not full stops - swap them (e.g. 1,23 --> 1.23)
return float.replace(/\,/g, '.');
};
//Uses both commas and full stops - ensure correct order and remove 1000s separators
return ((posC < posFS) ? (float.replace(/\,/g,'')) : (float.replace(/\./g,'').replace(',', '.')));
};
// <-- parseFloat(preformatFloat('5.200,75'))
// --> 5200.75
At the very least, this would allow parsing of British/American and European decimal formats (assuming the string contains a valid number).
From my origin country the currency format is like "3.050,89 €"
parseFloat identifies the dot as the decimal separator, to add 2 values we could put it like these:
parseFloat(element.toString().replace(/\./g,'').replace(',', '.'))
In my case, I already had a period(.)
and also a comma(,)
, so what worked for me was to replace
the comma(,)
with an empty string like below:
parseFloat('3,000.78'.replace(',', ''))
This is assuming that the amount from the existing database is 3,000.78. The results are: 3000.78
without the initial comma(,)
.