Jump to content

Add Amounts And Put In Element


Macchiato
 Share

Recommended Posts

I have two amounts, each one in an element. I'd like to add them together and put them in an other element. Anyone know a Javascript that can do this?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Add amounts and put in element</title></head> <body> <p id="firstAmount">$1,133.79</p> <p id="secondAmount">$1,900.00</p> <br /> Total: <p id="totalAmount">$0.00</p> </body></html>

  • Like 1
Link to comment
Share on other sites

look fordocument.getElementById() to retrieve values from elementsparseFloat() to convert string to float value, so you can add numerical values togethertoFixed(n) to convert value to a fixed number of digits after decimal point before being returned to id="totalAmount" using document.getElementById().innerHTML Experiment with these, and if you have any problems, post your problem and we will attempt to fix

Link to comment
Share on other sites

I got the following code:

function addCommasandsign(nStr)   {nStr += '';x = nStr.split('.');x1 = x[0];x2 = x.length > 1 ? '.' + x[1] : '';var rgx = /(\d+)(\d{3})/;while (rgx.test(x1)) {    x1 = x1.replace(rgx, '$1' + ',' + '$2');}return '$' + x1 + x2;    }//get htmlvar firstval=document.getElementById('firstAmount').innerHTML;var secval=document.getElementById('secondAmount').innerHTML;//replace $ and , by nothingfirstval=firstval.replace('$','');firstval=firstval.replace(',','');secval=firstval.replace('$','');secval=firstval.replace(',','');//add valuesvar total=firstval + secval;//put , and $ back in placevar total2=addCommasandsign(total);//insert in htmldocument.getElementById('totalAmount').innerHTML=total2;

There seem to be a small problem in the calculation though. I get an total amount of $1,133.791133 instead of $3,033.79 See this live example: jsfiddle.net/LGNwSYou know what the problem could be?

Link to comment
Share on other sites

Your live example isn't loading for me, but it's probably just due to floating point errors - try rounding the value of total to two decimal places (by multiplying, rounding, then dividing) using Math.round().

Link to comment
Share on other sites

First you are replacing the secval with firstval when replacing '$' and ',' firstval=firstval.replace('$','');firstval=firstval.replace(',','');secval= firstval .replace('$','');secval= firstval .replace(',',''); at this point it is still treated as text, adding them together will produce 1133.791900.00, this is where parseFloat() comes into play to convert text into a numeric float value, so you should have

firstval=firstval.replace('$','');firstval=firstval.replace(',','');secval=secval.replace('$','');secval=secval.replace(',','');  //add valuesvar total=parseFloat(firstval) + parseFloat(secval);//put , and $ back in placevar total2=addCommasandsign(total);//insert in htmldocument.getElementById('totalAmount').innerHTML=total2;

Edited by dsonesuk
  • Like 1
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...