/    Sign up×
Community /Pin to ProfileBookmark

Calculating total sum of array values

Hi,

Can someone help with my code. I want to calculate the total sum of document.form1.Total[i].value to put in the Grand Total box and i dont know how to do it without explicitly entering [0],[1] etc as Ive done here (Ill be adding more items). My code is below. Ive pasted in the lot so you can see what Im trying to acheive.

Thanks!

<script language=”JavaScript” type=”text/javascript”>
function calcTotal(){
var i;
for (i=0; i<document.form1.Total.length; i++)
{
var LP = parseFloat(document.form1.ListPrice[i].value);
var Q = parseInt(document.form1.Qty[i].value);
document.form1.Total[i].value = (LP * Q);

Tot = parseFloat(document.form1.Total[0].value) + parseFloat(document.form1.Total[1].value);
document.form1.GrandTotal.value = Tot;

}

}
</script>

<form action=”#” name=”form1″>
<table border=”1″>
<tr>
<td>Printer
</td>
<td>List Price
</td>
<td>Qty
</td>
<td>Total
</td>
</tr>

<tr>
<td>Printer A
</td>
<td><input type=”text” name=”ListPrice” value=”123.04″ readonly=””>
</td>
<td><input type=”text” name=”Qty” value=”0″ onkeyup=”calcTotal();”>
</td>
<td><input type=”text” name=”Total” value=”0″>
</td>
</tr>

<tr>
<td>Printer B
</td>
<td><input type=”text” name=”ListPrice” value=”543″ readonly=””>
</td>
<td><input type=”text” name=”Qty” value=”0″ onkeyup=”calcTotal();”>
</td>
<td><input type=”text” name=”Total” value=”0″>
</td>
</tr>

<tr>
<td>&nbsp;
</td>
<td>&nbsp;
</td>
<td align=”right”>Grand Total =
</td>
<td><input type=”text” name=”GrandTotal”>
</td>
</tr>
</table>
</form>

to post a comment
JavaScript

4 Comments(s)

Copy linkTweet thisAlerts:
@KorNov 01.2005 — [code=php]
<script type="text/javascript">
function calcTot(){
var lp = document.getElementsByName('ListPrice');
var qt = document.getElementsByName('Qty');
var to = document.getElementsByName('Total');
var gt=0;
for(var i=0;i<to.length;i++){
to[i].value=Number(lp[i].value)*Number(qt[i].value);
gt+=Number(to[i].value);
}
document.getElementsByName('GrandTotal')[0].value=gt;
}
</script>
[/code]
Copy linkTweet thisAlerts:
@konithomimoNov 01.2005 — There are a few things that you need to do:

  • 1. Give each text input a unique name and id. Even if that means just adding a number to the end. Creating more than one "ListPrice" will just cause problems. (in your case I suggest entering in a base name followed by a number since you dont want to have to manually put in the element names into the array)

  • 2. Create an array to use.

  • 3. use 'onBlur' instead of 'onkeyup'. The function should work fine either way, but unless you want it to display the GrandTotal with every digit input then it isnt necessary. If you want your user to see the numbers adding up though then you can leave it with 'onkeyup'.


  • The code below has all of that included. It takes all of the "Qty" elements and adds their values and then displays it as a "GrandTotal". I wasn't sure how you wanted the function to work though, because it was not set up real well. I didn't know if you wanted to add up the "ListPrice" totals, or what. You can just edit the line:

    quantity = "Qty" + i;

    To be what you want. Right now it is making the script add all of the "Qty" values.

    <i>
    </i>&lt;script type="text/javascript"&gt;
    function calcTotal(){

    var i;
    var totals = new Array();
    var GrandTotal=0;
    var quantity="Qty";
    var price = "ListPrice"
    var total="Total";

    for (i=0; i&lt;document.form1.Total.length; i++)
    {
    quantity = quantity + i;
    price = price + i;
    document.getElementById(total).value = ((document.getElementById(quantity).value) * (document.getElementById(price).value));
    totals[i] = document.getElementById(total).value;
    GrandTotal=GrandTotal + parseFloat(totals[i]);
    }

    document.getElementById('GrandTotal').value=GrandTotal;

    }
    &lt;/script&gt;

    &lt;form action="#" name="form1"&gt;
    &lt;table border="1"&gt;
    &lt;tr&gt;
    &lt;td&gt;Printer
    &lt;/td&gt;
    &lt;td&gt;List Price
    &lt;/td&gt;
    &lt;td&gt;Qty
    &lt;/td&gt;
    &lt;td&gt;Total
    &lt;/td&gt;
    &lt;/tr&gt;

    &lt;tr&gt;
    &lt;td&gt;Printer A
    &lt;/td&gt;
    &lt;td&gt;&lt;input type="text" name="ListPrice0" id="ListPrice0" value="123.04" readonly=""&gt;
    &lt;/td&gt;
    &lt;td&gt;&lt;input type="text" name="Qty0" id="Qty0" value="0" onBlur="calcTotal();"&gt;
    &lt;/td&gt;
    &lt;td&gt;&lt;input type="text" name="Total0" id="Total0" value="0"&gt;
    &lt;/td&gt;
    &lt;/tr&gt;

    &lt;tr&gt;
    &lt;td&gt;Printer B
    &lt;/td&gt;
    &lt;td&gt;&lt;input type="text" name="ListPrice1" id="ListPrice1" value="543" readonly=""&gt;
    &lt;/td&gt;
    &lt;td&gt;&lt;input type="text" name="Qty1" id="Qty1" value="0" onBlur="calcTotal();"&gt;
    &lt;/td&gt;
    &lt;td&gt;&lt;input type="text" name="Total1" id="Total1" value="0"&gt;
    &lt;/td&gt;
    &lt;/tr&gt;

    &lt;tr&gt;
    &lt;td&gt;&amp;nbsp;
    &lt;/td&gt;
    &lt;td&gt;&amp;nbsp;
    &lt;/td&gt;
    &lt;td align="right"&gt;Grand Total =
    &lt;/td&gt;
    &lt;td&gt;&lt;input type="text" name="GrandTotal" id="GrandTotal"&gt;
    &lt;/td&gt;
    &lt;/tr&gt;
    &lt;/table&gt;
    &lt;/form&gt;


    EDIT - being the idiot that I am, a minute after I walked away from the comp I realized what the function was supposed to do . . . man is it too early. Mornings suck.
    Copy linkTweet thisAlerts:
    @Lizzy_BauthorNov 01.2005 — Thank you. Thats fixed it!!! (The first lot of code fixed it, the second way i tried too but it gave an error) ?
    Copy linkTweet thisAlerts:
    @KorNov 01.2005 — 
    1. Give each text input a unique name and id.
    [/quote]

    Only id must be unique. But you must use carefully id's and names in order to pass the proper values to the server on submit.
    ×

    Success!

    Help @Lizzy_B spread the word by sharing this article on Twitter...

    Tweet This
    Sign in
    Forgot password?
    Sign in with TwitchSign in with GithubCreate Account
    about: ({
    version: 0.1.9 BETA 5.19,
    whats_new: community page,
    up_next: more Davinci•003 tasks,
    coming_soon: events calendar,
    social: @webDeveloperHQ
    });

    legal: ({
    terms: of use,
    privacy: policy
    });
    changelog: (
    version: 0.1.9,
    notes: added community page

    version: 0.1.8,
    notes: added Davinci•003

    version: 0.1.7,
    notes: upvote answers to bounties

    version: 0.1.6,
    notes: article editor refresh
    )...
    recent_tips: (
    tipper: @AriseFacilitySolutions09,
    tipped: article
    amount: 1000 SATS,

    tipper: @Yussuf4331,
    tipped: article
    amount: 1000 SATS,

    tipper: @darkwebsites540,
    tipped: article
    amount: 10 SATS,
    )...