How to convert a number where I replaced the dot with a comma from a string back to a decimal number

Question

I have an input field where users can enter decimal numbers by using a Dot or a comma ( Example: 79,99 or 79.99 ) . When users enter the number with a comma I replace it with a dot ( this number is then sent to a remote server for verification) . Now I would like to display the number after the user enters it in the footer using toFixed(2) function to display only the first two decimal numbers. I cant get it to work , because after converting it back to a number using ParseFloat the 2 decimals after the comma disappear.

Example:

User enter in the input field : 79,99 which is then set into the variable totalAmount:

$('#amount-1').keyup(function() {

getRefundAmount(1); // This function calls the calcTotalAmount function

})

function calcTotalAmount() {
console.log('calcTotalAmount');

var totalAmount = 0;
var totalRefund = 0;
var rowAmount = 0;
var rowRefund = 0;

for(var i = 1; i < 4; i++ ) {
    rowAmount = parseFloat($('#amount-' + i).val());
    rowRefund = parseFloat($('#result-' + i).text());
    if(!isNaN(rowAmount)) {
        totalAmount += rowAmount;
        totalRefund += rowRefund;
    }
}

var toPay = totalAmount-totalRefund;
totalAmount = totalAmount.toString().replace(/\,/g, '.');
totalAmount = parseFloat(totalAmount).toFixed(2);


$('#footer-refund').text(totalRefund)
$('#footer-total').text(totalAmount)
if (totalAmount == '') {
    $('#footer-total').text("0.00");
}
}

The Result displayed in the footer is : 79.00 instead of 79.99

May we see your input field please? Since you do a .toString() I think you set up your input to number, but 79,99 (with a comma) isn't a recognized number. — SmashingQuasar, Mar 29 '17 at 08:38
Yep, code is working perfectly fine for me in my test with an input type="text" and then doing: console.log(parseFloat(document.getElementById("test").value.toString().replace(/,/, "."))) — SmashingQuasar, Mar 29 '17 at 08:43
is the variable totalRefund that you use in the last line supposed to have the same value as totalAmount ? I assume you did a copy paste of your code, please note that you use two different variables here — Logar, Mar 29 '17 at 08:48
I think a proper way to do this is use internationalization handling http://stackoverflow.com/questions/9240714/format-number-with-locale-specific-settings — mootmoot, Mar 29 '17 at 09:14

score 0 · Answer 1 · answered Mar 29 '17 at 08:48

0

I tried your code in jsfiddle and got an error on the ".toFixed(2)" After changing it a bit i could prevent the error.:

$(function() {
   var totalAmount = '79,99';
   totalAmount = parseFloat( totalAmount.toString().replace(/\,/g, '.'));
   totalAmount = totalAmount.toFixed(2);
   $('#footer-refund').text(totalAmount)
});

https://jsfiddle.net/jkrielaars/2gb59xss/1/

answered Mar 29 '17 at 08:48

JasperZelf

2,731
1
22
34

seems to work in the fiddle, just by me not , I will post some more of the code , maybe there is something I am doing wrong... – Michael Kaner Mar 29 '17 at 09:28

score 0 · Answer 2 · answered Mar 29 '17 at 08:50

0

It seems like the code you've given works just fine but there are some fixes you could apply :

totalAmount = ("" + totalAmount).replace(/\,/g,'.');
totalAmount = parseFloat(totalAmount);
//use toFixed only if you don't restrict input to 2 decimals, but I'd recommend restricting input otherwise you'll encounter rounding issues

Btw, you do $('#footer-refund').text(totalRefund.toFixed(2)), shouldn't it be $("#footer-refund").text(totalAmount) (not sure why you use toFixed here too) ?

answered Mar 29 '17 at 08:50

Vivick

3,434
2
12
25

Yea that was one too much. Still I need to restrict it. – Michael Kaner Mar 29 '17 at 09:28
if you're using an `` in a `
` you can use something like this : `` Although, you need to keep in mind that `myregexhere` is the equivalent of `/myregexhere/g` in regular javascript
– Vivick Mar 29 '17 at 09:31

score 0 · Answer 3 · answered Mar 29 '17 at 10:10

Thanks for all the help :

solution is as follows : I have to check it in the for loop already and replace it there.

for(var i = 1; i < 4; i++ ) {
    if(!$('#amount-' + i).val()){continue;}else{ 
    rowAmount = parseFloat($('#amount-' + i).val().toString().replace(/\,/g,'.'));
    rowRefund = parseFloat($('#result-' + i).text());
    if(!isNaN(rowAmount)) {
        totalAmount += rowAmount;
        totalRefund += rowRefund;
    }
    }
}

How to convert a number where I replaced the dot with a comma from a string back to a decimal number

3 Answers3