Seeking a solution for another issue, I stumbled upon the capability to execute JavaScript on mouseover.
Here is what I want to execute:
$(document).ready(function(){
function myPayment()
{
var value = document.mortgagecalc.value_input.value;
var rate = document.mortgagecalc.rate_input.value;
var term = document.mortgagecalc.term_input.value;
var deposit = document.mortgagecalc.deposit_input.value;
var fee = document.mortgagecalc.fee_input.value;
var totalloan = ((value + fee) - deposit) * 1 + rate;
var totalinterest = (totalloan * 1 + rate) - totalloan;
var months = (term * 12);
var repay = totalloan / months;
var interest = totalinterest / months;
// Calculate mortgage payment and display result
document.getElementById('repay_input').value = repay;
document.getElementById('interest_input').value = interest;
}
}
Upon hovering over my submit button, I would like this script to fill in these fields, which will then be included in the form action:
<input type="hidden" name="repay" id="repay_input" value="">
<input type="hidden" name="interest" id="interest_input" value="">
Currently, it does not seem to be working. This could be due to a small mistake or the fact that it may not work at all.
Thank you - If anyone has a better suggestion on how to achieve my goal, please inform me. I have attempted PHP but without success.
Adding a button for clarification:
<button class="col-sm-4 enter-button" type="submit" name="submit" onmouseover="return myPayment()" value="Calculate">Calculate Payments</button>
Update:
I made adjustments to the JavaScript and the button, but forgot to match the form's name with the reference in the JS.
Furthermore, my mortgage calculations were significantly inaccurate due to the way the form collects the percentage rate.