Internet Explorer: Unable to set property value of undefined or null reference

advertisements

I have a javascript calculator that works without errors in every browser except Internet Explorer. I need to know why Internet Explorer is giving me this error at Line 14: "Unable to set property 'value' of undefined or null reference."

Here is the calculator code:

<meta http-equiv="x-ua-compatible" content="IE=10">
<script>

function showpay() {
"use strict";
if ((document.loanCalc.loan.value === null || document.loanCalc.loan.value.length === 0) ||
        (document.loanCalc.months.value === null || document.loanCalc.months.value.length === 0)
        ||
        (document.loanCalc.rate.value === null || document.loanCalc.rate.value.length === 0)) { document.loanCalc.pay.value = " ";
    } else {
     var princ = document.loanCalc.loan.value;
     var term  = document.loanCalc.months.value;
     var intr   = document.loanCalc.rate.value / 1200;
     document.loanCalc.pay.value = Math.round(princ * intr / (1 - (Math.pow(1 / (1 + intr), term))));
}
// payment = principle * monthly interest/(1 - (1/(1+MonthlyInterest)*Months))
}

</script>

<form name=loanCalc method=POST>
<table class="calculator">

<tr><td>Loan Amount</td><td align=right><input type=number onInput='showpay()' name=loan size=10 value="15000"></td></tr>

<tr><td>Term in Months</td><td align=right><input type=number onInput='showpay()' name=months size=10 value="60"></td></tr>

<tr><td>Interest Rate</td><td align=right><input type=number onInput='showpay()' name=rate size=10 value="1.99"></td></tr>

<tr><td>Monthly Payment</td></tr>

<tr><td align=left class=result><span>$</span><output name=pay>263</output></td></tr>

</table>
</form>

Internet Explorer's debugger says, "Unable to set property 'value' of undefined or null reference" at Line 14: document.loanCalc.pay.value = Math.round(princ * intr / (1 - (Math.pow(1 / (1 + intr), term))));

The code works in Chrome, Safari, and Firefox without errors. You can see the calculator in action on this page: http://bloomcu.com/test-page/

Why am I getting this error in Internet Explorer?


This is one line corrected (as per my comment)

<tr><td>Loan Amount </td><td><input type="number" onInput="showpay()" name="loan" id="loan" size="10" value="15000" style="text-align:right"></td></tr>

If you fix them all like this, it will be more in the direction of working everywhere.