I have a php page that calculates stuff using javascript and puts the results and values into divs using jquery.
an example of a calculation=
- Code: Select all
$("#calculatea,#calculateb").click(function() {
calc_loc1 = document.getElementById('calc_loc1');
num_lights = parseFloat(document.getElementById('num_lights').value);
bulb_watt = parseFloat(document.getElementById('bulb_watt').value);
led_watt = parseFloat(document.getElementById('led_watt').value);
daily_hrs = parseFloat(document.getElementById('daily_hrs').value);
days_year = parseFloat(document.getElementById('days_year').value);
cost_kwatt = parseFloat(document.getElementById('cost_kwatt').value);
cur = ((((.001)*((num_lights)*(bulb_watt))) * ( ((daily_hrs)*(days_year)) * (cost_kwatt) ) ));
cur_runcost = cur.toFixed(2);
led = ((((.001)*((num_lights)*(led_watt))) * ( ((daily_hrs)*(days_year)) * (cost_kwatt) ) ));
led_runcost = led.toFixed(2);
led_price = parseFloat(document.getElementById('led_price').value);
initialdec = (led_price * num_lights);
initial = initialdec.toFixed(2);
sav = (cur_runcost - led_runcost);
saving = sav.toFixed(2);
roi1 = (initial/(sav/12));
roi = roi1.toFixed(2);
$("#initial").html("$ " + initial);
$("#roi").html(roi+" months");
});
the html part is:
- Code: Select all
<div id="calculator">
<input type="text" placeholder="enter location" id="calc_loc1"></input>
<div class="calc-heading">Energy Saving Lighting Calculator</div>
<div class="calc-sect">
Number of lights
<input type="text" id="num_lights" />
</div>
<div class="calc-sect">
Current bulb wattage (Watts)
<input type="text" id="bulb_watt" />
</div>
<div class="calc-sect">
LED wattage (Watts)
<input type="text" id="led_watt" />
</div>
<div class="calc-sect">
Daily Use (hours)
<input type="text" id="daily_hrs" />
</div>
<div class="calc-sect">
Days use (per year)
<input type="text" id="days_year" />
</div>
<div class="calc-sect">
Electricity cost kWatt / hour
<input type="text" id="cost_kwatt" />
</div>
<div class="calc-sect">
<input type="button" id="calculatea" value="Calculate" />
</div>
<div class="calc-sect">
Current running cost (yearly)
<div id="cur_runcost">
</div>
</div>
<div class="calc-sect">
LED running cost (yearly)
<div id="led_runcost">
</div>
</div>
<div class="calc-sect">
Yearly Saving
<div id="saving" class="bam">
</div>
</div>
<div class="roi-heading">View return on Investment</div>
<div class="calc-sect">
LED bulb price
<input type="text" id="led_price" />
</div>
<div class="calc-sect">
Initial investment
<div id="initial">
</div>
</div>
<div class="calc-sect">
Return of investment
<div id="roi">
</div>
</div>
<div class="calc-sect">
<input type="button" id="calculateb" value="Calculate" />
</div>
</div>
I want to make a button that creates a downloadable pdf once clicked gets all the data that is in the divs.
So basically I want tcpdf to get the elements from the divs (document.getElementById('calc_loc1')....
Its all purely client side calculations...I managed to get some variables to appear using jspdf, but it was buggy as hell so i stopped, therefore i know its possible.
Im open to any suggestions
