View the Code

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}%`
};