Round every textbox to 2 decimal places

Question

This is probably really simple, but for the life of me I can't work out how to do it. So here goes: I have a large form with lots of text boxes, which are all currency based and so need to be rounded off to 2 decimal places. The values of these textboxes are all generated dynamically by some JavaScript functions I wrote, and I can use .toFixed(2); to round them up/down to 2 decimal places. However, it gets tiring and repetitive to have to put this after working out each value of each textbox. How could I write a simple piece of JavaScript (can be jQuery) to target all the textboxes and round them ALL to 2 decimal places?

Thanks for any help :)

P.S Sorry for the lack of any code, but there isn't really any to show, as its all locked up in big functions. But here's what I'm essentially doing:

function workOutSomeVal() {
    // lots of code to work out values and stuff
    var finalValue = some mathematical equation to work out value;
    var anotherValue = a different value;
    $(".some-textbox").val((finalValue).toFixed(2));
    $(".another-textbox").val((anotherValue).toFixed(2));
} // my question is, how could I get rid of .toFixed(2) and put in a generic statement somewhere to target all the textboxes?

Can you assign all textboxes you want to impact class `Roundable` (or whatever word you like)? Then you can get them all at once and process in one loop. — PM 77-1, Aug 09 '14 at 23:39

score 2 · Accepted Answer · answered Aug 09 '14 at 23:39

2

You can have a function you call that does this:

function roundTextBoxes() {
    $("input[type=text]").val(function() {
        return (+this.value).toFixed(2);
    });
}

...and then call that any time any of them changes. Live Example: http://jsbin.com/toyoc/1

It will probably mean that sometimes, a user looking at the page who does the mental arithmetic will find that it doesn't quite add up...

answered Aug 09 '14 at 23:39

T.J. Crowder

1,031,962
187
1,923
1,875

I *think* that's exactly what I'm looking for, but I don't have much time to test it now as it's getting late in the UK but when I test out these answers tomorrow, I'll let you know - thanks :) – Tom Oakley Aug 09 '14 at 23:48
2

This looks like the proper way of handling what OP is asking to me. Exactly what I would have suggested. Now the problem comes if you dont want to handle ALL inputs like this. In that case youll need to put a context on the selector and maybe pass that into the function. – Scott Mitchell Aug 09 '14 at 23:49
@ScottMitchell: Indeed. – T.J. Crowder Aug 09 '14 at 23:50

score 1 · Answer 2 · answered Aug 09 '14 at 23:43

You can give a common class to all the textboxes which you want to be "roundable", and then select then using that class and apply your rounding logic to each of them.

// let's say all the roundable textboxes have the class "roundable"
$('.roundable').each(function() {
  var value = // some mathematical equation to work out value
  $(this).val((value).toFixed(2));
});

Drea58 · Answer 3 · 2014-08-10T11:50:14.890

Another appoach:
Why don't you put value.toFixed(2) at the end of your calculation ?

var finalValue = function(){
   // var value = some calculation  
   return value.toFixed();
}

Or - if you need the full value elsewhere, create a new function:

var finalValueView = function(){
     finalValue().toFixed(2);       
} 

function workOutSomeVal() {
     // ...
     $(".some-textbox").val(finalValueView);
 }

score -3 · Answer 4 · edited Aug 10 '14 at 00:35

-3

Use Math.round(num * 100) / 100

edited Aug 10 '14 at 00:35

Dave Cousineau

12,154
8
64
80

answered Aug 09 '14 at 23:41

user3591167

46
3

3

There's no guarantee, with IEEE-754 double-precision floating point, that dividing a whole number by 100 will only give you two digits to the right of the decimal in the result (because of FP imprecision issues). Whereas the function referenced by the OP, `toFixed`, will. *(Not my dv)* – T.J. Crowder Aug 09 '14 at 23:45

Round every textbox to 2 decimal places

4 Answers4