A simple way to view how this program was written.
function calculate() {
// Step 1: Getting the data
let bal = Number(document.getElementById("balance").value);
let term = Number(document.getElementById("term").value);
let rate = Number(document.getElementById("rate").value);
// Step 2: Run Collected Data
let totMonPay = (bal) * (rate / 1200) / (1 - Math.pow((1 + rate / 1200), -term));
let remBal = bal;
let intPay = remBal * rate / 1200;
let prinPay = totMonPay - intPay;
let totIntPay = 0;
let accuPay = 0;
// Step 3: Result / Outputting to table
let template = `
Month
Payment
Principal
Interest
Total Interest
Balance
`;
for (let i = 1; i <= term; i++) {
totIntPay += intPay;
prinPay = totMonPay - intPay;
remBal = remBal - prinPay;
intPay = remBal * rate / 1200;
accuPay += totMonPay;
//How result will be formatted as loop continues
template += `
${i}
${totMonPay.toFixed(2)}
${prinPay.toFixed(2)}
${intPay.toFixed(2)}
${totIntPay.toFixed(2)}
${remBal.toFixed(2)}
`
};
document.getElementById("result").innerHTML = template;
document.getElementById("termMon").innerHTML = `${term} months`
document.getElementById("totBal").innerHTML = `$${bal}`
document.getElementById("monPay").innerHTML = `$${totMonPay.toFixed(2)}`;
document.getElementById("intRate").innerHTML = `${rate}%`
};
function isNumber(evt) {
evt = (evt) ? evt : window.event;
var charCode = (evt.which) ? evt.which : evt.keyCode;
if (charCode > 31 && (charCode < 46) || (charCode > 46 && (charCode < 48) || charCode > 57)) {
return false;
}
return true;
};
// Button Event
document.getElementById('calc').addEventListener('click', function () {
let verifyBal = Number(document.getElementById('balance').value);
let verifyTerm = Number(document.getElementById('term').value);
let verifyRate = Number(document.getElementById('rate').value);
if (verifyBal == "" || verifyTerm == "" || verifyRate == "" ) {
Swal.fire({
icon: 'error',
title: 'Oops...',
text: 'Please fill out all selections before using the calculator.',
})
}
else {
calculate();
}
});