Example CONTACT FORM 7 form with calculated fields using events and javascript

Here is the sample form and the accompanying javascript for calculating fields in a contact form 7 form.
The code was created originally for the Cazadero Performing Arts Family Camp, but never put into use because they changed their website.

There is some inline javascript which is very dense. I am sure the code could be improved by moving the inline code elsewhere, but, at the time, I was pretty happy to just have this working. The inline code does not allow any formatting like tabs and line breaks, so it looks like a jungle of code!

SAMPLE CONTACT FORM 7 FORM WITH CALCULATED FIELDS USING EVENTS AND JAVASCRIPT
<!-- by Karla Leibowitz, 2011, www.karlakarla.com -->
<div style="margin-top:5px;background:#667700; color:white; ">
<strong> CAMPER FEES (Camper fees are based on ages as of the first day of each session.)

[text adults 4/ "0"]<strong> Enter # of Adults (19+) $725/pp </strong>
[text kids 4/ "0"]<strong> Enter # of campers Ages 6-18 $640/pp </strong>
[text youngandold 4/ "0"]<strong> Enter # of campers Ages 3-5 & SENIORS (over 65) $415/pp </strong>
[text babies 4/ "0"]<strong> Enter # of campers Ages 2 & Under (no charge)</strong>

<strong> HOUSING OPTIONS : SELECT AN OPTION FROM BELOW (required)
<em style="color:red; background:white;">Tent cabins and dorm rooms available on a first come, first served basis. </em></strong>
<input type="radio" name="housing" value="You are a group of 4 or 5 and request a tent cabin if available" onclick="this.form.hadj.value=0; this.form.hmul.value=1" />You are a group of 4 or 5 and request a tent cabin if available (no extra fee)
<input type="radio" name="housing"  value="You are a group of 3 or less and request a tent cabin. " onclick="this.form.hadj.value=360; this.form.hmul.value=1;"/>You are a group of 3 or less and request a tent cabin. Additional $360.00
<input type="radio" name="housing"  value="You have 6 or more people in one tent cabin. " onclick="this.form.hadj.value=0; this.form.hmul.value=.90" />You have 6 or more people in one tent cabin. 10% off
<input type="radio" name="housing"  value="Your group will be sharing a tent cabin with another family.  " onclick="this.form.hadj.value=0; this.form.hmul.value=.90"/>Your group will be sharing a tent cabin with another family.  Each family must have 2 or more. 10% off
---- Enter other family name here [text sharefamily]
<input type="radio" name="housing"  value="Your group will bring and sleep in a tent, an RV, or a car." onclick="this.form.hadj.value=0; this.form.hmul.value=.90"/>Your group will bring and sleep in a tent, an RV, or a car. 10% off
<input type="radio" name="housing" value="You have 2-3 in your group and you would like a dorm room " onclick="this.form.hadj.value=0; this.form.hmul.value=1" />You have 2-3 in your group and you would like a dorm room (no extra fee)
---- If no dorm room is available then I will
---- [checkbox nodormroom "Share tent cabin with another small group" "Stay in tent cabin with only your group ($360 fee added if necessary)"]

<strong> DONATIONS  </strong>
$[text fcsf 7/7 "0"] Please consider a tax-deductible donation to the Family Camp Scholarship Fund
$[text lpdf 7/7 "0"] Please consider a tax-deductible donation to the Lanier Pruitt Diversity Fund
<div style="background:paleGreen; color:black; padding:5px;margin-top:4px;">
Calculate your payments <strong>
<input type="button" value="Click here" style="background:blue; color:white; border: 2px black solid" onclick="this.form.adultcost.value=this.form.adults.value*725; this.form.kidcost.value=this.form.kids.value*640; this.form.yocost.value=this.form.youngandold.value*415;this.form.total.value=addcampers(this.form.adultcost.value, this.form.kidcost.value,this.form.yocost.value);this.form.totalwreg.value=addcampers(this.form.total.value, 50, 0); this.form.totalh.value=addcampers(this.form.totalwreg.value*this.form.hmul.value, this.form.hadj.value, 0);this.form.totalpay.value=addcampers(this.form.totalh.value, this.form.fcsf.value, this.form.lpdf.value);  this.form.deposit.value=addcampers(this.form.adults.value*100, this.form.kids.value*100,this.form.youngandold.value*100);this.form.deposit.value=addcampers(this.form.deposit.value,50,0);this.form.balancedue.value=addcampers(this.form.totalpay.value,this.form.deposit.value*-1,0);this.form.housingtype.value=housingval(); "> to see totals.
If you change camper numbers, housing option, or donations, then you must click to recalculate.
</strong>
$[text* total 5/] TOTAL CAMPER COST -- Breakdown $[text* adultcost 5/] adults $[text* kidcost 5/] youth $[text* yocost 5/] Junior and Senior
$[text* totalwreg 5/] WITH REGISTRATION FEE

[text* housingtype 60/]
$[text* totalh 5/] WITH HOUSING ADJUSTMENTS  (
<input style="border:none;background:transparent; text-align:center" type="text" name="hadj" size="2" readonly="readonly"> surcharge
<input style="border:none;background:transparent;text-align:center;" type="text" name="hmul" size="2" readonly="readonly"> multiplier )

$[text* totalpay 7/7] TOTAL PAYMENT DUE INCLUDING DONATIONS

MINIMUM INITIAL DEPOSIT DUE WITH REGISTRATION FORM*
Amount: $[text* deposit 7/7]   (Includes registration fee and $100 per camper)

BALANCE DUE BY JUNE 1, 2011  $[text* balancedue 7/7]
</div>
<div style="background: #FFA500; margin-top:4px; padding:5px; color:black;">

[submit "Send"]
</div>

Here is the javascript code that you would need to install in a script section of your web page to complete this example.

function  addcampers(one, two, three) {
sum=eval(one)+eval(two)+eval(three)
return sum
}
function housingval() {
for (i=0;i<document.forms[0].housing.length;i++) {
   if (document.forms[0].housing[i].checked) {
       user_input = document.forms[0].housing[i].value;
   }
}

return user_input
}