PDA

View Full Version : Sum Two Different Totals in a Form

kennywhite
Oct 15th, 2010, 07:13 PM
Hello.

I have been struggling with figuring this out on my own for over a week and have had no luck, so it is time to ask for some guidance. The idea of this seemed very simple, but I may just be too much of a Javascript noob to figure it out.

I have a form where users will enter in orders that have been returned to us. They will enter in the part numbers returned, the quantity of each part number, and the quantity of the part that was returned damaged.

I need to be able to add up the total quantity in one input box and the total damaged quantity in another input box.

The input boxes are named Quantity1, Quantity2, DamagedQTY1, DamagedQTY2, and so on.

There could be up to 100 different part numbers on each order, so I would need to loop through 100 input boxes.

Here is the sample code that I found and started trying to customize. I was unable to figure out how to get the loop or the second set of numbers to be added to work.

<script type="text/javascript">

function startCalc(){
interval = setInterval("calc()",1);
}
function calc(){
one = document.autoSumForm.firstBox.value;
two = document.autoSumForm.secondBox.value;
document.autoSumForm.thirdBox.value = (one * 1) + (two * 1);
}
function stopCalc(){
clearInterval(interval);
}

</script>

<BODY>

<form name="autoSumForm">
<input type=text name="firstBox" value="" onFocus="startCalc();" onBlur="stopCalc();"> +
<input type=text name="secondBox" value="" onFocus="startCalc();" onBlur="stopCalc();"> =
<input type=text name="thirdBox">
</form>

Thank you in advance for any help!

Philip M
Oct 15th, 2010, 08:06 PM
This should give you a template to work with.

<form name = "myform">
Q1 <input name="Quantity" type="text" /><br>
Q2 <input name="Quantity" type="text" /><br>
Q3 <input name="Quantity" type="text" /><br>
Q4 <input name="Quantity" type="text" /><br>
Q5 <input name="Quantity" type="text" /><br>
<!-- and as many more as you require -->

<input type = button value = "Total Quantities" onclick = "chk('Quantity')">
</form>

<script type = "text/javascript">
function chk(objName) {
var total = 0;
var arr = new Array();
arr = document.getElementsByName(objName);
var len = arr.length; // the number of input boxes named "Quantity"
for(var i = 0; i < len; i++) {
var obj = document.getElementsByName(objName).item(i); // take each value in turn
if ((obj.value != "") && (!isNaN(obj.value))) { // skip if value is blank or NaN - but you may want to require that a number is entered
total = total + parseInt(obj.value); // add them up
}
}
alert ("Sum total of these " + len + " values named " + objName + " is " + total);
}
</script>

Assuming that the second set of input texboxes is named "Damaged", just call the script again passing the
appropriate name - <input type = button value = "Total Damaged" onclick = "chk('Damaged')">

There is no place for setInterval() here!!! :confused::(

BTW, the time to say "thanks" is afterwards, not beforehand which gives the - doubtless unintended - impression that you take other people's voluntary unpaid assistance and expertise for granted. Or as British politician Neil Kinnock put it, "Don't belch before you have had the meal." Prefer to use "please" beforehand and if you find a response helpful then you can use the "Thank User For This Post" button.

I am neither decided nor undecided. - BBC Political Commentator.

kennywhite
Oct 15th, 2010, 08:35 PM
Oh, I definitely don't take any help for granted. I'm just thankful that people like you take the time to help out those in need.

The above code you provided is simple and great, but it doesn't exactly do what I need. I need to sum up two different totals and have them displayed below the form in input boxes.

Philip M
Oct 15th, 2010, 08:45 PM
Oh, I definitely don't take any help for granted. I'm just thankful that people like you take the time to help out those in need.

The above code you provided is simple and great, but it doesn't exactly do what I need. I need to sum up two different totals and have them displayed below the form in input boxes.

Well, surely you can manage that by yourself :( - simply change the alert to

if (objName == "Quantity") {
document.myform.elementname.value = total;
}

and repeat for "Damaged".

I have shown you how to total the second set of input textboxes.

Old Pedant
Oct 15th, 2010, 08:53 PM
This isn't quite what his <form> looks like. See his post in the ASP forum:
http://www.codingforums.com/showthread.php?t=207036 (and prior threads where I showed him how to do this stuff)

He actually has

<form name = "myform">
Q1 <input name="Quantity1" type="text" /><br>
Q2 <input name="Quantity2" type="text" /><br>
Q3 <input name="Quantity3" type="text" /><br>
Q4 <input name="Quantity4" type="text" /><br>
Q5 <input name="Quantity5" type="text" /><br>

So it's very similar, but in some ways simpler:

<script type="text/javascript">
function getTotal()
{
var total = 0;
for ( var i = 1; i < 999999; ++i )
{
var qtyfld = document.forms[0].elements["Quantity"+i];
if ( qtyfld == null ) break; // no more such felds...out of loop
var qty = parseInt( qtyfld.value );
if ( ! isNaN(qty) ) total += qty;
}
document.forms[0].total.value = total;
}
</script>
...
<form ...>
...
<input name="Quantity1" onchange="getTotal()" />
<input name="Quantity2" onchange="getTotal()" />
<input name="Quantity3" onchange="getTotal()" />
...