Javascript: Adding $ + cents

Question

A short while ago I had posted about adding a comma to the value once it reached a certain number (1000).

At the moment, the value is going up $11 every second, although I would like to implement a change so that it goes up $11.43 every second.

For example: 0, $11.43, $22.86 ... and then when it reaches $1000 it should have the comma ($1,024.56). You should get the drift.

Here is my jsFiddle: http://jsfiddle.net/m9cey/14/

var millisecs = 1000;
setInterval(function() {
    var $badge = $('#badge');
    var num = parseInt($badge.text().replace(',', ''))+11;
    $badge.text(num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","));
}, millisecs);

Any help will be much appreciated.

Cheers

And the best answer there IMHO was [accounting.js](http://josscrowcroft.github.io/accounting.js/) — kichik, Aug 15 '13 at 00:40

Ted Hopp · Answer 1 · 2013-08-15T17:04:13.937

It's easy enough to add $11.43. However, there are two problems:

avoid inserting commas after the decimal point.
rounding errors due to floating point

To address both of these, I suggest the following:

Do everything in cents. So add 1143 (not 11.43)
To format, first convert the number to a string, then split the string into a prefix and the last two characters. Put commas into the prefix, then add a period and the last two characters.

Oh, and you'll need to do a couple of other things:

get rid of the badge-support-text span that you have in your fiddle, since you're going to be adding in the cents explicitly
strip out the decimal point as well as the commas before you parse the current amount. You might also consider creating a closure that maintains its own internal data that is incremented, so you don't have to parse.

Here's a modification of your jsfiddle that does the above (except the closure):

var millisecs = 1000;
setInterval(function() {
    var $badge = $('#badge');
    var num = (parseInt($badge.text().replace(/[,.]/g, ''))+1143).toString();
    var dollars = num.substring(0, num.length-2);
    var cents = num.substr(-2);
    $badge.text(dollars.replace(/\B(?=(\d{3})+(?!\d))/g, ",") + '.' + cents);
}, millisecs);

Thanks for your response. Ok i'm not too familiar with javascript although this is what i'm thinking. Convert the number to a string: var num = 1143; var n = num.toString(); Split the string into prefix: Having trouble... Put commas into the prefix Not sure Add a period and the last 2 characters. Not sure — tebrown, Aug 15 '13 at 01:08

score 0 · Answer 2 · answered Aug 15 '13 at 02:38

here is a fiddle that shows how it should look. this is just one way to do it

var millisecs = 10;
setInterval(function() {
  var $badge = $('#badge');

  var num = parseFloat($badge.text().replace(',', ''))+11.34;
  num = num.toFixed(2);

  var numString = num.toString().split('.');

  var dollars = numString[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  var cents = numString[1];

  var str = [dollars, cents].join('.');

  $badge.text( str );
}, millisecs);

Javascript: Adding $ + cents

2 Answers2