SitePoint Sponsor

User Tag List

Results 1 to 2 of 2

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    Jan 2012
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    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. #2
    Non-Member Max Height's Avatar
    Join Date
    Dec 2011
    Posts
    303
    Mentioned
    6 Post(s)
    Tagged
    1 Thread(s)
    Code:
    document.getElementById('year4')
    where is the element 'year4' in your code?


Bookmarks

Posting Permissions

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