Can't change Value of a Global Variable

greenhat · 09-21-2012, 06:57 PM

I need help with this calculate script. In the first function, I cannot seem to assign a value to the global variable grandTotal for whatever reason. I want a span with id grandTotal to display it. If change it to a string it works. So i assigned a the value from the function to it.

How do I either get the global variable to accept it or add the total from the second function calculateChurch() total to it and display an updated total?

Code:

<script type="text/javascript">
	var LHtotal;
	var AHtotal;
	var LMtotal;
	var AMtotal;
	var schoolTotal;
	var churchTotal ;
	var grandTotal;
	
	function calculateSchool(orgType) {
		var fund = parseInt(document.getElementById(orgType + 'fund').value);
		var people = parseInt(document.getElementById(orgType + 'people').value);
		var percent = (parseInt(document.getElementById(orgType + 'percent').value))/100;
		var active = people * percent;
		active = parseInt(active);
		var baskets = parseInt(document.getElementById(orgType + 'baskets').value);
		var numPerYear = parseInt(document.getElementById(orgType + 'numPerYear').value);
		var price = 26.00;
		var commision = 0.06;
		var total = fund * active * baskets * numPerYear * price * commision;
		total = total.toFixed(2);
		LHtotal = parseFloat(document.getElementById("LHtotal").innerHTML);
		AHtotal = parseFloat(document.getElementById("AHtotal").innerHTML);
		LMtotal = parseFloat(document.getElementById("LMtotal").innerHTML);
		AMtotal = parseFloat(document.getElementById("AMtotal").innerHTML);
		//alert(LHtotal + " " + AHtotal + " " + LMtotal + " " + AMtotal);
		schoolTotal = (LHtotal + AHtotal + LMtotal + AMtotal);
		//alert(schoolTotal);
		
		if(isNaN(schoolTotal)) {
			schoolTotal = "";
		}
		
		if(isNaN(active)) {
			active = "";
		}
		if(isNaN(total)) {
			total = "";
		}
		var Ototal = parseFloat(document.getElementById("Ototal").innerHTML);
		var Etotal = parseFloat(document.getElementById("Etotal").innerHTML);
		var orgTotal = (Ototal + Etotal);
		var orgTotal = orgTotal.toFixed(2);
		grandTotal = Number(schoolTotal + orgTotal);
		if(isNaN(grandTotal)) {
			grandTotal = "";
		}
		if(isNaN(orgTotal)) {
			orgTotal = "";
		}
		document.getElementById("orgTotal").innerHTML = orgTotal;
		document.getElementById(orgType + 'total').innerHTML = total;
		document.getElementById(orgType + 'active').innerHTML = active;
		document.getElementById("schoolTotal").innerHTML = schoolTotal;
	        document.getElementById("grandTotal").innerHTML = schoolTotal;
		
		
	}
	function calculateChurch(orgType) {
		var num = parseFloat(document.getElementById(orgType + "num").value);
		var members = parseFloat(document.getElementById(orgType + "members").value);
		var percent = parseFloat(document.getElementById(orgType + "percent").value)/100;
		var baskets = parseFloat(document.getElementById(orgType + "baskets").value);
		var fundPerYear = parseFloat(document.getElementById(orgType + "fundPerYear").value);
		var total = num * members * percent * baskets * fundPerYear;
		total = total.toFixed(2);
		if(isNaN(total)) {
			total = "";
		}
		document.getElementById(orgType + 'total').innerHTML = total;
		var Ltotal = parseFloat(document.getElementById('Ltotal').innerHTML);
		var Atotal = parseFloat(document.getElementById('Atotal').innerHTML);
		churchTotal = (Ltotal + Atotal);
		churchTotal = churchTotal.toFixed(2);
		if(isNaN(churchTotal)) {
			churchTotal = "";
		}
		document.getElementById("churchTotal").innerHTML = churchTotal;
		document.getElementById("grandTotal").innerHTML = document.getElementById("grandTotal").innerHTML + churchTotal;
	}

Philip M · 09-21-2012, 07:36 PM

You are using grandTotal both as the name of an HTML element and a global Javascript variable. That will cause IE to barf.

Same with

var LHtotal;
var AHtotal;
var LMtotal;
var AMtotal;

But the big problem is

var orgTotal = orgTotal.toFixed(2);
grandTotal = Number(schoolTotal + orgTotal);

.toFixed() converts the numeric value to a string so the following + sign concatenates, not adds the values.

You should use toFixed() only to make a value for display purposes. It cannot be used for any subsequent mathematical calculation.

If you need to retain the value as a number use

Code:

<script type = "text/javascript">

function roundToDigits(number,digits) {
var p = Math.pow(10, digits);
return Math.round(number*p)/p;
}

alert (roundToDigits(123.456789,2));

</script>

Quizmaster: Do you know what 20 per cent of 100 is?
Contestant: 20 per cent of 100 is five per cent

greenhat · 09-21-2012, 09:22 PM

All i am trying to do is get a total and update an element

Old Pedant · 09-21-2012, 11:20 PM

Code:

		var orgTotal = (Ototal + Etotal);
// the var on the next line is BOGUS...you can't use var for the same name twice
// but in any case GET RID of this next line COMPLETELY:
		/* var orgTotal = orgTotal.toFixed(2); */ 

		grandTotal = Number(schoolTotal + orgTotal);
		if(isNaN(grandTotal)) {
			grandTotal = "";
		} else {
                        grandTotal = grandTotal.toFixed(2);
                }
		if(isNaN(orgTotal)) {
			orgTotal = "";
		} else {
                        orgTotal = orgTotal.toFixed(2);
                }
		document.getElementById("orgTotal").innerHTML = orgTotal;
		document.getElementById(orgType + 'total').innerHTML = total;
		document.getElementById(orgType + 'active').innerHTML = active;
		document.getElementById("schoolTotal").innerHTML = schoolTotal;
//	        document.getElementById("grandTotal").innerHTML = schoolTotal; ??? SURELY THIS IS WRONG ???
// shouldn't it be
		document.getElementById("schoolTotal").innerHTML = grandTotal;

red means kill it
blue means add it

greenhat · 09-22-2012, 12:16 AM

The else statements cause it not to display the value at all. I got rid of to.fixed(). document.getElementById("grandTotal").innerHTML only shows if I:

Change it to a string
change it to schoolTotal

That is fine for the first function for it to show schoolTotal. When the second function runs, the value is not replaced with the updated total. In, fact churchTotal will not display even in another element.

Old Pedant · 09-22-2012, 12:28 AM

Maybe you will have to show us the actual page.

Anyway, this is bogus:

Code:

document.getElementById("grandTotal").innerHTML = 
      document.getElementById("grandTotal").innerHTML + churchTotal;

That will *NOT* add the NUMBERS. It will append the strings.

Maybe you could use

Code:

document.getElementById("grandTotal").innerHTML = 
   Number(document.getElementById("grandTotal").innerHTML) + churchTotal;

BUt I'm just having a hard time following the logic of the code.

I don't see why you need the isNaN() checks in there. When will the values being checked ever NOT be numbers??

greenhat · 09-22-2012, 12:39 AM

here is the HTML right now

HTML

Code:

 <h3>Try Our Calculator!</h3>
					<table id="example1">
                                           <tr>
                                                <th>Secondary Schools</th>
                                                <th># of School Fundraisers</th>
                                                <th># of Enrolled</th>
                                               <th>% Participating</th>
                                              <th>No. Students on Clubs/Teams</th>
                                               <th>Gift Baskets Sold</th>
                                                <th>$26 Avg Whsle Price</th>
                                               <th>Fundraisers Per Year</th>
                                               <th>Commission</th>
                                               <th>Your Total Commission</th>
                                            </tr>
                                            <tr>
                                                <td>Large High Schools (55 Clubs/Teams) 2400+ Students</td>
                                                <td><input type="text" id='LHfund' name"" size="5" onchange='calculateSchool("LH")'/>x</td>
                                                
                                                <td>[<input type="text" id='LHpeople' name"" size="4" onchange='calculateSchool("LH")'/></td>
                                                
                                                <td>x<input type="text" id='LHpercent' name"" size="5" onchange='calculateSchool("LH")'/></td>
                                                
                                                <td id='LHactive'>= ]</td>
                                                
                                                <td>x<input type="text" id='LHbaskets' name"" size="4" onchange='calculateSchool("LH")'/></td>
                                               <td id='LHprice'> x$26.00</td>
                                                <td>x <input type="text" id='LHnumPerYear' name"" size="5" onchange='calculateSchool("LH")'/></td>
                                                <td id='commision'>x<b>6% =</b></td>
                                                
                                                <td id='LHtotal'></td>
                                            </tr>
                                           
                                            <tr>
                                               <td>Avg High Schools (40 Clubs/Teams) 855+ Students</td>
                                              <td><input type="text" id='AHfund' name"" size="5" onchange='calculateSchool("AH")'/>x</td>
                                                
                                                <td>[<input type="text" id='AHpeople' name"" size="4" onchange='calculateSchool("AH")'/></td>
                                                
                                                <td>x<input type="text" id='AHpercent' name"" size="5" onchange='calculateSchool("AH")'/></td>
                                                
                                                <td id='AHactive'>= ]</td>
                                                
                                                <td>x<input type="text" id='AHbaskets' name"" size="4" onchange='calculateSchool("AH")'/></td>
                                               <td> x&nbsp;$26.00</td>
                                                <td>x <input type="text" id='AHnumPerYear' name"" size="5" onchange='calculateSchool("AH")'/></td>
                                                <td>x<b>&nbsp;6% &nbsp;=</b></td>
                                                
                                                <td id='AHtotal'></td>
                                           </tr>
                                            <tr>
                                               <td>Large Middle Schools (55 Clubs/Teams) 1855+ Students</td>
                                              <td><input type="text" id='LMfund' name"" size="5" onchange='calculateSchool("LM")'/>x</td>
                                                
                                                <td>[<input type="text" id='LMpeople' name"" size="4" onchange='calculateSchool("LM")'/></td>
                                                
                                                <td>x<input type="text" id='LMpercent' name"" size="5" onchange='calculateSchool("LM")'/></td>
                                                
                                                <td id='LMactive'>= ]</td>
                                                
                                                <td>x<input type="text" id='LMbaskets' name"" size="4" onchange='calculateSchool("LM")'/></td>
                                               <td> x&nbsp;$26.00</td>
                                                <td>x <input type="text" id='LMnumPerYear' name"" size="5" onchange='calculateSchool("LM")'/></td>
                                                <td>x<b>&nbsp;6% &nbsp;=</b></td>
                                                
                                                <td id='LMtotal'></td>
                                           </tr>
                                           <tr>
                                               <td>Avg Middle Schools (40 Clubs/Teams) 650+ Students</td>
                                              <td><input type="text" id='AMfund' name"" size="5" onchange='calculateSchool("AM")'/>x</td>
                                                
                                                <td>[<input type="text" id='AMpeople' name"" size="4" onchange='calculateSchool("AM")'/></td>
                                                
                                                <td>x<input type="text" id='AMpercent' name"" size="5" onchange='calculateSchool("AM")'/></td>
                                                
                                                <td id='AMactive'>= ]</td>
                                                
                                                <td>x<input type="text" id='AMbaskets' name"" size="4" onchange='calculateSchool("AM")'/></td>
                                               <td> x&nbsp;$26.00</td>
                                                <td>x <input type="text" id='AMnumPerYear' name"" size="5" onchange='calculateSchool("AM")'/></td>
                                                <td>x<b>&nbsp;6% &nbsp;=</b></td>
                                                
                                                <td id='AMtotal'></td>
                                           </tr>
                                            <tr>
                                               	<td>Total Commissions From Schools</td>
                                               	<td> </td>
                                                <td> </td>
                                                <td> </td>
                                                <td> </td>
                                                <td> </td>
                                                <td> </td>
                                                <td> </td>
                                                <td> </td>
                                                <td style="border:2px solid #000;" id='schoolTotal'></td>
                                                <input type="hidden" name="myname" value="" id="1sub"/>
                                            </tr>
                                  </table>
				<button  type="button" onclick="calculateSchool('LH')">Calculate</button>
                   		</div><!--end infoTextTableWrapper-->
				
                         <div id="infoTextTableWrapper">
                              <h3>Calculator Example of a Church</h3>
                             			 <table id="example1">
                                           <tr>
                                                <th>Churches</th>
                                                <th># of Churches</th>
                                                <th># of Members</th>
                                               <th>% Participating</th>
                                               <th>Gift Baskets Sold</th>
                                                <th>$26 Avg Wholesale Price</th>
                                               <th>Fundraisers Per Year</th>
                                               <th>6% Commission</th>
                                              <th>Your Total Commission</th>
                                            </tr>
                                            <tr>
                                                <td>Large Churches (1000+ Members) </td>
                                                <td><input type="text" id='Lnum' name"" size="5" onchange='calculateChurch("L")'/></td>
                                                
                                                <td>x<input type="text" id='Lmembers' name"" size="5" onchange='calculateChurch("L")'/></td>
                                                
                                                <td>x<input type="text" id='Lpercent' name"" size="5" onchange='calculateChurch("L")'/></td>
                                                
                                                <td>x<input type="text" id='Lbaskets' name"" size="5" onchange='calculateChurch("L")'/></td>
                                                <td>x $26.00</td>
                                                <td>x<input type="text" id='LfundPerYear' name"" size="5" onchange='calculateChurch("L")'/></td>
                                               
                                                <td> 6%</td>
                                                <td id='Ltotal'>= </td>
                                            </tr>
                                           
                                            <tr>
                                               <td>Avg Churches (100-999 Members)</td>
                                               <td><input type="text" id='Anum' name"" size="5" onchange='calculateChurch("A")'/></td>
                                                
                                                <td>x<input type="text" id='Amembers' name"" size="5" onchange='calculateChurch("A")'/></td>
                                                
                                                <td>x<input type="text" id='Apercent' name"" size="5" onchange='calculateChurch("A")'/></td>
                                                
                                                <td>x<input type="text" id='Abaskets' name"" size="5" onchange='calculateChurch("A")'/></td>
                                                <td>x $26.00</td>
                                                <td>x<input type="text" id='AfundPerYear' name"" size="5" onchange='calculateChurch("A")'/></td>
                                               
                                                <td> x6%</td>
                                                <td id='Atotal'>= </td>
                                         </tr>
                                          <tr>  
                                             <td>Total Commissions From Churches</td>
                                             <td> </td>
                                             <td> </td>
                                             <td> </td>
                                             <td> </td>
                                             <td> </td>
                                             <td> </td>
                                             <td> </td>
                                             <td style="border:2px solid #000;" id='churchTotal'></td>
                    					<tr/>
                    		</table>

                   		</div><!--end infoTextTableWrapper-->
        			<div id="infoTextTableWrapper">
                        <h3>Calculator Example of a Church</h3>
           							<table id="example1">
                                           <tr>
                                                <th>Secondary Schools</th>
                                                <th># of School Fundraisers</th>
                                                <th># of Enrolled</th>
                                               <th>% Participating</th>
                                              <th>No. Students on Clubs/Teams</th>
                                               <th>Gift Baskets Sold</th>
                                                <th>$26 Avg Whsle Price</th>
                                               <th>Fundraisers Per Year</th>
                                               <th>Commission</th>
                                               <th>Your Total Commission</th>
                                            </tr>
                                            <tr>
                                                <td>Elementary Schools(PTO Others) 500+</td>
                                                <td><input type="text" id='Efund' name"" size="5" onchange='calculateSchool("E")'/></td>
                                                
                                                <td>x<input type="text" id='Epeople' name"" size="4" onchange='calculateSchool("E")'/></td>
                                                
                                                <td>x<input type="text" id='Epercent' name"" size="5" onchange='calculateSchool("E")'/></td>
                                                
                                                <td id='Eactive'></td>
                                                
                                                <td>x<input type="text" id='Ebaskets' name"" size="4" onchange='calculateSchool("E")'/></td>
                                               <td> x$26.00</td>
                                                <td>x <input type="text" id='EnumPerYear' name"" size="5" onchange='calculateSchool("E")'/></td>
                                                <td>x<b>6% =</b></td>
                                                
                                                <td id='Etotal'></td>
                                            </tr>
                                           
                                            <tr>
                                               <td>Organizations</td>
                                              <td><input type="text" id='Ofund' name"" size="5" onchange='calculateSchool("O")'/></td>
                                                
                                                <td>x<input type="text" id='Opeople' name"" size="4" onchange='calculateSchool("O")'/></td>
                                                
                                                <td>x<input type="text" id='Opercent' name"" size="5" onchange='calculateSchool("O")'/></td>
                                                
                                                <td id='Oactive'></td>
                                                
                                                <td>x<input type="text" id='Obaskets' name"" size="4" onchange='calculateSchool("O")'/></td>
                                               <td> x&nbsp;$26.00</td>
                                                <td>x <input type="text" id='OnumPerYear' name"" size="5" onchange='calculateSchool("O")'/></td>
                                                <td>x<b>&nbsp;6% &nbsp;=</b></td>
                                                
                                                <td id='Ototal'></td>
                                           </tr>
                                            <tr>
                                               	<td>Total Commissions From Schools</td>
                                               	<td> </td>
                                                <td> </td>
                                                <td> </td>
                                                <td> </td>
                                                <td> </td>
                                                <td> </td>
                                                <td> </td>
                                                 <td> </td>
                                                <td id='orgTotal' style="border:2px solid #000;"></td>
                                            </tr>
                                  </table>
				<button type="button" onclick="calculateSchool('O')">Calculate</button>
                   		 </div><!--end infoTextTableWrapper-->
                        <div id="redBar2"><p>Total Number of commissions from schools, churches and organizations: $</p>
                        <span id="grandTotal"></span> <span id="grandTotalx"></span>

Old Pedant · 09-22-2012, 01:03 AM

Sorry. I don't understand the logic of it. Your button says "Calculate" under "Total commission for schools", but then the only thing you look at/work on is "LH" school line, ignoring the other lines. Just doesn't make sense to me.