I have been trying to get a javascript finance calculator table inserted in my product.tpl page
I have hard coded it into the file and that works...but I'd rather have it as a VQMod
I have also managed to get a similar table added into my checkout payment_methods.tpl file it doesn't include the script at the end of this file .... I have tried removing the script and running the vqmod but from some reason the product.tpl version doesn't take effect.
I have checked the code using an online validator too.
Any help would be great.
Code: Select all
<modification>
<id>Finance Calc Add in Description</id>
<version>1</version>
<vqmver>2.1.7</vqmver>
<author>Me</author>
<file name="catalog/view/theme/default/template/product/product.tpl">
<operation>
<search position="before" index="1">
<![CDATA[
<?php if ($review_status) { ?>
]]>
</search>
<add>
<![CDATA[
<?php $price = preg_replace('/[^0-9\.]/', '', $price); ?>
<div class="calc">
<form>
<table cellspacing="1" cellpadding="0" width="410" align="center" background="creditcalbg.jpg">
<tr>
<td style="background-color:#FF3333;color:white" colspan="2" align="center"><font size="5"><b>Finance Examples</b></font>
</td>
</tr>
<tr>
<td width="50%" align="right">
Item Cost :</td>
<td align="center"> £
<label id="cost">0.00</label>
</td>
</tr>
<tr>
<td width="50%" align="right">Deposit (min.10%) :</td>
<td align="center"> £
<label id="deposit">0.00</label>
</td>
</tr>
<tr>
<td width="50%" align="right">Loan Amount :</td>
<td align="center"> £
<label id="loanamount">0.00</label>
</td>
</tr>
<tr>
<td width="50%" align="right">
Select Option :</td>
<td width="50%" align="center">
<select Id="term" onChange="Calculate();">
<!-- <option value="0¦0">Select Finance Term</option> -->
<option value="0.083333¦12">12months 0% APR Representative</option>
<option value="0.055556¦18">18months 0% APR Representative</option>
<option value="0.036297¦36">36months 19.9% APR Representative</option>
</select>
</td>
</tr>
<tr>
<td width="50%" align="right">Total Cost of Credit :</td>
<td align="center"> £
<label id="costofcredit">0.00</label>
</td>
</tr>
<tr>
<td width="50%" align="right">Total Loan Amount Payable :</td>
<td align="center"> £
<label id="totalpayable">0.00</label>
</td>
</tr>
<tr><td> </td><td> </td></tr>
<tr>
<td width="50%" align="right">
<label id="months">0</label> Monthly Payments :</td>
<td align="center"> £
<label id="monthlypay">0.00</label>
</td>
</tr>
<tr>
<td style="background-color:#FF3333;color:white" colspan="2" align="center"><font size="1">Minimum loan amounts and terms and conditions apply. Credit provided by FINANCE COMPANY. FINANCE COMPANY is authorised and regulated by the Financial Authority.</font></td>
</tr>
</table>
</form><br><br>
</div>
<script type="text/javascript"><!--
$('select[Id=term] option:eq(2)').attr('selected', 'selected').trigger('change');
function Calculate() {
var value = document.getElementById("term").value;
var split = value.split("¦");
var multiplier = split[0];
var term = split[1];
var months = term;
var price = <?php echo json_encode($price); ?>;
var cost = price;
var depositcalc = price * 0.1;
var deposit = depositcalc.toFixed(2);
var loanamountcalc = price * 0.9;
var loanamount = loanamountcalc.toFixed(2);
var monthlypaycalc = loanamount * multiplier;
var monthlypay = monthlypaycalc.toFixed(2);
var totalpayablecalc = monthlypay * term;
var totalpayable = totalpayablecalc.toFixed(2);
var negpayable = (totalpayable < loanamount) ? loanamount:totalpayable;
var costofcreditcalc = totalpayable - loanamount;
var costofcredit = costofcreditcalc.toFixed(2);
var negcost = (costofcreditcalc < 0) ? "0.00":costofcredit;
document.getElementById('cost').innerHTML = cost;
document.getElementById('deposit').innerHTML = deposit;
document.getElementById('loanamount').innerHTML = loanamount;
document.getElementById('costofcredit').innerHTML = negcost;
document.getElementById('totalpayable').innerHTML = negpayable;
document.getElementById('months').innerHTML = months;
document.getElementById('monthlypay').innerHTML = monthlypay;
};
//-->
</script>
]]>
</add>
</operation>
</file>
</modification>
