SitePoint Sponsor

# Thread: Calculation field not working right

1. ## Calculation field not working right

Can someone PLEASE show me what I am doing wrong with my code here?

Basically, I have a registration form. In this registration form, I have 4 people register. It depends on each person birthyear to determine the amount of fees for each person.

The fees are: Registration Fee, Hotel Fee, Meal Fee, Discount

Also, the trick is only first and second persons get Hotel Fee and Discount Fee. Third and Fourth person only pay Registration Fee and Meal Fee.

So when user select birthyear from a dropdown menu for each person, the fees will be automatically filled in the input fields for each person and then do a total calculation.

Each person will have a total of fees and there is another total field to automatically total up all 4 total fields from those 4 people.

So here is my code so far

Javascript
Code:
```<script type="text/javascript">
function doUpdate(year, num)
{
if (isNaN(year)) return;
var regfee = '0';
var meal = '0';
var hotel = '0';
//REGISTRATION Price
if (year >= 2000)
{
regfee = '0';
}
else if (year < 2000 && year > 1995 )
{
regfee = '20';
}
else
{
regfee = '30';
}
//MEAL Price
if (year < 2001)
{
meal = '80';
}
else if (year >= 2001 && year <= 2009)
{
meal = '60';
}
else
{
meal = '0';
}
// HOTEL Price
if(document.getElementById('year1').value!='')
{
hotel='199';
}
else if (document.getElementById('year2').value!='')
{
hotel='199';
}

//DISCOUNT Price
if (document.getElementById('vip'+num).checked==true)
{
if (year > 1993)
{
discount = '0';
}
else if (year == 1993)
{
discount = '0';
}
else
{
discount = '-20';
}
}
else
{
if (year > 1993)
{
discount = '0';
}
else if (year == 1993)
{
discount = '0';
}
else
{
discount = '-10';
}

}

document.getElementById('regfee' + num).value = regfee;
document.getElementById('meal' + num).value = meal;

if(document.getElementById('year1').value!=''){

document.getElementById('hotel1').value = hotel;
document.getElementById('discount1').value = discount;

//Write to total field for second person
document.getElementById('total1').value = parseInt(regfee)+parseInt(meal)+parseInt(hotel)+parseInt(discount);
}
if(document.getElementById('year2').value!=''){
document.getElementById('hotel2').value = hotel;
document.getElementById('discount2').value = discount;

//Write to total field for second person
document.getElementById('total2').value = parseInt(regfee)+parseInt(meal)+parseInt(hotel)+parseInt(discount);
}
if(document.getElementById('year3').value!='' && document.getElementById('year4').value!=''){
document.getElementById('hotel3').value == '0';
document.getElementById('discount3').value == '0';
document.getElementById('hotel4').value == '0';
document.getElementById('discount4').value == '0';

// Write to total fields for third and fourth person
document.getElementById('total3').value = parseInt(regfee)+parseInt(meal);
document.getElementById('total4').value = parseInt(regfee)+parseInt(meal);
}

// Write to subtotal field by sum up all 4 total fields
document.getElementById('subtotal1').value = parseInt(document.getElementById('total1').value) + parseInt(document.getElementById('total2').value) + parseInt(document.getElementById('total3').value) + parseInt(document.getElementById('total4').value);
}

</script>```
and here is my form
Code:
```<form action="form.html" method="post" class="js_submit" name="form1" id="form1">
<table>
<tr>
<td>VIP</td>
<td>Birthyear</td>
<td>Registration Fee</td>
<td>Hotel Fee</td>
<td>Meal Fee</td>
<td>Discount</td>
<td>Total</td>
</tr>
<!-----------First Persion ------------------->
<tr>
<td><input type="checkbox" name="vip1" id="vip1" value="Y" class="inpt_c"  /></td>
<td><select name="year1" id="year1" onchange='doUpdate(this.value * 1,1);'>
<option selected="selected"></option>
<option value="2011">2011<option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>
<option value="2007">2007</option>
<option value="2006">2006</option>
<option value="2005">2005</option>
<option value="2004">2004</option>
<option value="2003">2003</option>
<option value="2002">2002</option>
<option value="2001">2001</option>
<option value="2000">2000</option>
<option value="1999">1999</option>
<option value="1998">1998</option>
<option value="1997">1997</option>
<option value="1996">1996</option>
<option value="1995">1995</option>
<option value="1994">1994</option>
<option value="1993">1993</option>
<option value="1992">1992</option>
<option value="1991">1991</option>
<option value="1990">1990</option>
<option value="1989">1989</option>
<option value="1988">1988</option>
<option value="1987">1987</option>
<option value="1986">1986</option>
<option value="1985">1985</option>
<option value="1984">1984</option>
<option value="1983">1983</option>
<option value="1982">1982</option>
<option value="1981">1981</option>
</select></td>
<td><input type="text" id="regfee1" name="regfee1" class="inpt_a" value=""/></td>
<td><input type="text" value="" id="hotel1" name="hotel1" class="inpt_a" /></td>
<td><input type="text" value="" id="meal1" name="meal1" class="inpt_a" /></td>
<td><input type="text" value="" id="discount1" name="discount1" class="inpt_a"/></td>
<td><input type="text" value="" id="total1" name="total1" class="inpt_a" /></td>
</tr>
<!------------Second Person ----------------->
<tr>
<td><input type="checkbox" name="vip2" id="vip2" value="Y" class="inpt_c"  /></td>
<td><select name="year2" id="year2" onchange='doUpdate(this.value * 1,2);'>
<option selected="selected"></option>
<option value="2011">2011<option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>
<option value="2007">2007</option>
<option value="2006">2006</option>
<option value="2005">2005</option>
<option value="2004">2004</option>
<option value="2003">2003</option>
<option value="2002">2002</option>
<option value="2001">2001</option>
<option value="2000">2000</option>
<option value="1999">1999</option>
<option value="1998">1998</option>
<option value="1997">1997</option>
<option value="1996">1996</option>
<option value="1995">1995</option>
<option value="1994">1994</option>
<option value="1993">1993</option>
<option value="1992">1992</option>
<option value="1991">1991</option>
<option value="1990">1990</option>
<option value="1989">1989</option>
<option value="1988">1988</option>
<option value="1987">1987</option>
<option value="1986">1986</option>
<option value="1985">1985</option>
<option value="1984">1984</option>
<option value="1983">1983</option>
<option value="1982">1982</option>
<option value="1981">1981</option>
</select></td>
<td><input type="text" id="regfee2" name="regfee2" class="inpt_a" value=""/></td>
<td><input type="text" value="" id="hotel2" name="hotel2" class="inpt_a" /></td>
<td><input type="text" value="" id="meal2" name="meal2" class="inpt_a" /></td>
<td><input type="text" value="" id="discount2" name="discount2" class="inpt_a"/></td>
<td><input type="text" value="" id="total2" name="total2" class="inpt_a" /></td>
</tr>
<!-----------Third Person ------------------->
<tr>
<td><input type="checkbox" name="vip3" id="vip3" value="Y" class="inpt_c"  /></td>
<td><select name="year3" id="year3" onchange='doUpdate(this.value * 1,3);'>
<option selected="selected"></option>
<option value="2011">2011<option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>
<option value="2007">2007</option>
<option value="2006">2006</option>
<option value="2005">2005</option>
<option value="2004">2004</option>
<option value="2003">2003</option>
<option value="2002">2002</option>
<option value="2001">2001</option>
<option value="2000">2000</option>
<option value="1999">1999</option>
<option value="1998">1998</option>
<option value="1997">1997</option>
<option value="1996">1996</option>
<option value="1995">1995</option>
<option value="1994">1994</option>
<option value="1993">1993</option>
<option value="1992">1992</option>
<option value="1991">1991</option>
<option value="1990">1990</option>
<option value="1989">1989</option>
<option value="1988">1988</option>
<option value="1987">1987</option>
<option value="1986">1986</option>
<option value="1985">1985</option>
<option value="1984">1984</option>
<option value="1983">1983</option>
<option value="1982">1982</option>
<option value="1981">1981</option>
</select></td>
<td><input type="text" id="regfee3" name="regfee3" class="inpt_a" value=""/></td>
<td><input type="text" value="" id="hotel3" name="hotel3" class="inpt_a" /></td>
<td><input type="text" value="" id="meal3" name="meal3" class="inpt_a" /></td>
<td><input type="text" value="" id="discount3" name="discount3" class="inpt_a"/></td>
<td><input type="text" value="" id="total3" name="total3" class="inpt_a" /></td>
</tr>
<!----------Fourth Person -------------------->
<tr>
<td><input type="checkbox" name="vip4" id="vip4" value="Y" class="inpt_c"  /></td>
<td><select name="year1" id="year1" onchange='doUpdate(this.value * 1,4);'>
<option selected="selected"></option>
<option value="2011">2011<option>
<option value="2010">2010</option>
<option value="2009">2009</option>
<option value="2008">2008</option>
<option value="2007">2007</option>
<option value="2006">2006</option>
<option value="2005">2005</option>
<option value="2004">2004</option>
<option value="2003">2003</option>
<option value="2002">2002</option>
<option value="2001">2001</option>
<option value="2000">2000</option>
<option value="1999">1999</option>
<option value="1998">1998</option>
<option value="1997">1997</option>
<option value="1996">1996</option>
<option value="1995">1995</option>
<option value="1994">1994</option>
<option value="1993">1993</option>
<option value="1992">1992</option>
<option value="1991">1991</option>
<option value="1990">1990</option>
<option value="1989">1989</option>
<option value="1988">1988</option>
<option value="1987">1987</option>
<option value="1986">1986</option>
<option value="1985">1985</option>
<option value="1984">1984</option>
<option value="1983">1983</option>
<option value="1982">1982</option>
<option value="1981">1981</option>
</select></td>
<td><input type="text" id="regfee4" name="regfee4" class="inpt_a" value=""/></td>
<td><input type="text" value="" id="hotel4" name="hotel4" class="inpt_a" /></td>
<td><input type="text" value="" id="meal4" name="meal4" class="inpt_a" /></td>
<td><input type="text" value="" id="discount4" name="discount4" class="inpt_a"/></td>
<td><input type="text" value="" id="total4" name="total4" class="inpt_a" /></td>
</tr>
<!------------Subtotal of all 4 totals above ------------>
<tr>
<td colspan="6"> <input name="subtotal1" type="text" id="subtotal1" class="inpt_a" value="" readonly="readonly"  /></td>
</tr>
</form>```
Here is my form URL: http://daihoibaptit.org/form.html

Thanks for your help

2. Code:
`document.getElementById('year4')`
where is the element 'year4' in your code?

#### Posting Permissions

• You may not post new threads
• You may not post replies
• You may not post attachments
• You may not edit your posts
•