How to round off parseFloat results in Jquery/Javascript?

Davinchie_214 picture Davinchie_214 · Mar 29, 2012 · Viewed 11.3k times · Source

How would I round off a value from a textfield with a parseFloat result in it? This application basically sums up the value of all radio buttons when clicked and displays the sum in a textbox.

The code below works perfectly if the radio button value is an integer, however if I want to have a floating point value on the radio button, the total value will have a 100.0000000679 when it should be 100. Any tips would be very much appreciated. Thanks in advance.

function calcscore(){
  var score = 0;
  $(".calc:checked").each(function(){
    score+=parseFloat($(this).val(),10);
  });
  $("input[name=openingsum]").val(score);
}
$().ready(function(){
    $(".calc").change(function(){
        calcscore();
    });
});

HTML Code:

<input class="calc" name="v2" type="radio" onclick="ver2(this);" value="1.6666666666666666666666666666667" />Yes
<input class="calc" name="v2" type="radio" onclick="ver2(this);" value="0" />No

Answer

Neysor picture Neysor · Mar 29, 2012

At first i think you provided us with a different example then expected. If you tell us something about getting 100.0000000679 and in your code is only a value of 1.6666666666666666666666666666667 there is something wrong :)

So I hope your problem is only to round the correct way. For that you can use .toFixed()

See the example on jsfiddle

HTML:

<input class="calc" name="v1" type="radio" onclick="ver2(this);" value="1.6666666666666666666666666666667" />Yes
<input class="calc" name="v1" type="radio" onclick="ver2(this);" value="0" />No
<br>
<input class="calc" name="v2" type="radio" onclick="ver2(this);" value="1.6666666666666666666666666666667" />Yes
<input class="calc" name="v2" type="radio" onclick="ver2(this);" value="0" />No
<br>
<input class="calc" name="v3" type="radio" onclick="ver2(this);" value="1.6666666666666666666666666666667" />Yes
<input class="calc" name="v3" type="radio" onclick="ver2(this);" value="0" />No
<br>
<input type="text" name="openingsum">​

JAVASCRIPT:

function calcscore(){
  var score = 0;
  $(".calc:checked").each(function(){
    score+=parseFloat($(this).val(),10);
  });
  score = score.toFixed(2);
  $("input[name=openingsum]").val(score);
}
$().ready(function(){
    $(".calc").change(function(){
        calcscore();
    });
});​