[Javascript] doing totals of form values client side -examples - Solved

[Jason Belanger]

Hi Peter,

thanks again for your help. Here is what I was trying to do. It's not elegant and not scaleable but it does what I need it to do. If you think it can be improved, let me know. But don't worry, I've got my calculations.

function maketotal() {
var itemA=document.bulb.A.value * 25;
var itemB=document.bulb.B.value * 8;
var itemC=document.bulb.C.value * 8;
var itemD=document.bulb.D.value * 10;
var itemE=document.bulb.E.value * 10;
var itemF=document.bulb.F.value * 10;
var itemG=document.bulb.G.value * 10;
var itemH=document.bulb.H.value * 8;
var itemI=document.bulb.I.value * 8;
var itemJ=document.bulb.J.value * 8;
var itemK=document.bulb.K.value * 8;
var itemL=document.bulb.L.value * 8;
var itemM=document.bulb.M.value * 8;
var itemN=document.bulb.N.value * 10;
var itemO=document.bulb.O.value * 8;
var itemP=document.bulb.P.value * 12;
var itemQ=document.bulb.Q.value * 15;

var totalcost= (itemA + itemB + itemC + itemD + itemE + itemF + itemG + itemH + itemI + itemJ + itemK + itemL + itemM + itemN + itemO + itemP + itemQ)

document.bulb.TOTAL.value=totalcost; 
}

Cheers!
jason

Jason Belanger
Web Technologies System Specialist
(613) 759-7809
belangerj at em.agr.ca
http://www.agr.ca/

>>> "Peter Brunone" <peter at brunone.com> 08/21/01 01:45PM >>>
Jason,

    I'm not sure of the "for each" syntax in JS, but I have done a loop --
for() or while() works; while the first means you don't have to increment,
the second gives you more control over the loop -- that uses an index to go
through document.formName.elements[] one at a time.  Test for the existence
document.bulb.elements[i].options to see if it's a SELECT, and then you're
pretty much in the clear.

    Another approach would be to keep all the current values in a JavaScript
array and just alter the currently changing piece to get the new total.
That way you don't have to worry about type changes (i.e. having to
parseInt(formfield.value) because field values are held as strings).  You'll
know if you have to use parseInt et al because instead of adding, your
values will concatenate (e.g. what should be 1 + 3 will be 13 ).

    Does this make enough sense?

-Peter

----- Original Message -----
From: "Jason Belanger" <BELANGERJ at EM.AGR.CA>
To: <javascript at LaTech.edu>
Sent: Tuesday, August 21, 2001 12:19 PM
Subject: Re: [Javascript] doing totals of form values client side -examples


Peter, thanks for your help. I did a bit of work on my own and came up with
this using an OnChange and pull down menus:

function maketotal() {
var itemA=document.bulb.A.value * 25;
var itemB=document.bulb.B.value * 8;
var itemC=document.bulb.C.value * 8;

var totalcost= itemA + itemB +itemC
document.bulb.TOTAL.value=totalcost;
}

How would I use a loop in a case like this?
For each item in document.bulb ??
//do stuff
Next

If I am setting the values, do I "need" to use the ParseInt and ParseFloat?
What kinds of things happen when I don't use them?

TIA

Jason


Jason Belanger
Web Technologies System Specialist
(613) 759-7809
belangerj at em.agr.ca 
http://www.agr.ca/ 

>>> "Peter Brunone" <peter at brunone.com> 08/21/01 12:09PM >>>
Jason,

    If you want to update in real time, just slap an onChange event handler
on all changeable text fields.  Remember to parseInt() or parseFloat() the
form field value since it starts as a string; not much more to it.  It's
even simpler for checkbox values, as you can see at
http://www.digitaltechnologyconsulting.com/orderform.asp .

Cheers,

Peter

----- Original Message -----
From: "Jason Belanger" <BELANGERJ at EM.AGR.CA>
To: <javascript at LaTech.edu>
Sent: Tuesday, August 21, 2001 10:14 AM
Subject: [Javascript] doing totals of form values client side - examples


Does anyone have any examples or URLs on making running totals for purchase
webpage using Javascript?

Jason

Jason Belanger
Web Technologies System Specialist
(613) 759-7809
belangerj at em.agr.ca 
http://www.agr.ca/ 

_______________________________________________
Javascript mailing list
Javascript at LaTech.edu 
http://www.LaTech.edu/mailman/listinfo/javascript 


_______________________________________________
Javascript mailing list
Javascript at LaTech.edu 
http://www.LaTech.edu/mailman/listinfo/javascript 

_______________________________________________
Javascript mailing list
Javascript at LaTech.edu 
http://www.LaTech.edu/mailman/listinfo/javascript 


_______________________________________________
Javascript mailing list
Javascript at LaTech.edu 
http://www.LaTech.edu/mailman/listinfo/javascript