k0rxt2
asked on
Calculating Grand Total using javascript
I am building a shopping cart, and I am having trouble getting the Grand total;
my table has four colums,
( Product Name : Unit price: Quantity: Cost )
How would I go about adding the data in the" COST" colum, and displaying,please note I am not that knoweldgeable so if you can explain it to me as simple and as complete as possible with a simple working example that would be great ,the rows in the table are dynamic.
my table has four colums,
( Product Name : Unit price: Quantity: Cost )
How would I go about adding the data in the" COST" colum, and displaying,please note I am not that knoweldgeable so if you can explain it to me as simple and as complete as possible with a simple working example that would be great ,the rows in the table are dynamic.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
I apologise, I just re-read what i wrote, i think I might have pointed you in the wrong direction.
Yes my data comes from the database, except for the quantity, which is static field in the database and popuates the qty field with a "1".
The user will the enter in a new quantity which should updates the COST field.
Finally I would like to display the GRAND TOTAL , in which you will add all the prices in the COST colum together to give the Final Cost.
Yes my data comes from the database, except for the quantity, which is static field in the database and popuates the qty field with a "1".
The user will the enter in a new quantity which should updates the COST field.
Finally I would like to display the GRAND TOTAL , in which you will add all the prices in the COST colum together to give the Final Cost.
<html>
<head>
<script type="text/javascript">
<!--
function checkCost()
{
var counter=0;
var grandtotal=0;
for (var i=0; i<document.shop_cart.lengt
{
if (document.shop_cart[i].nam
{
unitprice = (document.shop_cart[i-2].v
quantity = (document.shop_cart[i-1].v
document.shop_cart[i].valu
grandtotal += parseFloat(document.shop_c
}
}
document.shop_cart.grandto
}
-->
</script>
</head>
<body onload="checkCost();">
<form name="shop_cart" action="your_action_form" method="post">
<table cellpadding="0" cellspacing="0">
<tr><td>Product Name</td><td>Unit price</td><td>Quantity</td
<tr><td>_DISPLAY_PRODUCT_N
<tr><td>_DISPLAY_PRODUCT_N
<tr><td>_DISPLAY_PRODUCT_N
<tr><td colspan="4" align="right"><input type="text" name="grandtotal" value="" readonly> </td></tr>
</table>
</form>
</body>
</html>
<head>
<script type="text/javascript">
<!--
function checkCost()
{
var counter=0;
var grandtotal=0;
for (var i=0; i<document.shop_cart.lengt
{
if (document.shop_cart[i].nam
{
unitprice = (document.shop_cart[i-2].v
quantity = (document.shop_cart[i-1].v
document.shop_cart[i].valu
grandtotal += parseFloat(document.shop_c
}
}
document.shop_cart.grandto
}
-->
</script>
</head>
<body onload="checkCost();">
<form name="shop_cart" action="your_action_form" method="post">
<table cellpadding="0" cellspacing="0">
<tr><td>Product Name</td><td>Unit price</td><td>Quantity</td
<tr><td>_DISPLAY_PRODUCT_N
<tr><td>_DISPLAY_PRODUCT_N
<tr><td>_DISPLAY_PRODUCT_N
<tr><td colspan="4" align="right"><input type="text" name="grandtotal" value="" readonly> </td></tr>
</table>
</form>
</body>
</html>
Please replace the value of _DISPLAY_UNIT_COST_HERE and the value in the unitprice[] input element to the one in your database.
Woody,
As it is currency you are working with to get the decimals right you probably want to use fixed and avoid any possibility of getting burned by the javascript tendency to generate incorrect values for float arithmetic:
I would change the calculations to this way perhaps:
unitprice = new Number (document.shop_cart[i-2].v
quantity = new Number (document.shop_cart[i-1].v
totalval = new Number(unitprice * quantity);
document.shop_cart[i].valu
grandtotal += totalval;
}
}
document.shop_cart.grandto
You're doing a good job. Keep it up.
Cd&
As it is currency you are working with to get the decimals right you probably want to use fixed and avoid any possibility of getting burned by the javascript tendency to generate incorrect values for float arithmetic:
I would change the calculations to this way perhaps:
unitprice = new Number (document.shop_cart[i-2].v
quantity = new Number (document.shop_cart[i-1].v
totalval = new Number(unitprice * quantity);
document.shop_cart[i].valu
grandtotal += totalval;
}
}
document.shop_cart.grandto
You're doing a good job. Keep it up.
Cd&
Thank you for the input.
I did not put the toFixed in there, because I got an error in my localhost.
LOL.
Probably I just do a toFixed without declaring any new Number instance.
Thanks for that. I'll remember now. :p
Woody
I did not put the toFixed in there, because I got an error in my localhost.
LOL.
Probably I just do a toFixed without declaring any new Number instance.
Thanks for that. I'll remember now. :p
Woody
What server side scripting language do you use for page composition? ASP, PHP, JSP, Perl?
therefore, you should have the initial data.
then what we do here is actually to check the form, to see if there is any textbox with the name of "cost[]", then you should take the value of the previous element multiplied by the value of the second previous element.
This is supporting dynamic, because you only need to add in a value in the checkCost(), because this is where it prevents the javascript to check all page.
however, if you want the system to check for all page, then we could change the script a little bit, and it will check all elements input.
hope this is understandable. :p
thank you.