I’ve made a Mortgage calculator that is supposed to calculate monthly payments and the amount of total payments when data is entered. I’ve set the form up, but everytime I click on Calculate, the form clears and does not list the answers in the two bottom windows. Here is my work, how can it be corrected to work?
<html>
<head>
<title>Mortgage Calculator</title>
<body>
<h1 align=”center”><b>Mortgage Calculator</b></h1>
<hr align=”center” size=”6″ width=”75%”>
<p> Enter the yearly interest rate as a decimal (e.g., 8.5%=0.085), the total number of monthly
payments and the amount of the mortgage. Click on the “Calculate” button to view the monthly
payment. Click on the “Reset” button to reset the form.</p>
<hr align=”center” size=”3″ width=”100%”>
<body>
<style>
.numbers {text-align:right; background-color:lightyellow}
.fmlabel {color:black}
</style>
<script>
function dollars(n) {
n=eval(n);
n=Math.round(n*100)/100;
return (n == Math.round(n)) ? n += “.00” : (n
}
function Monthly(I,N,S) {
// I=yearly interest rate;
// N=number of monthly payments;
// S=loan amount;
return (S*I/12
}
function ShowVal() {
I=eval(document.mortgage.I.value);
N=eval(document.mortgage.N.value);
S=eval(document.mortgage.S.value);
document.mortgage.Payment.value=dollars(Monthly());
document.mortgage.Total.value=dollars(Monthly()*N);
}
</script>
</head>
<table width=”520″ valign=”top” align=”center” colspan=”2″>
<tr>
<!– Start Calculator Form –>
<form name=”mortgage” method=”post” onsubmit=”return ShowVal()” onreset=”location.reload()”>
<td valign=”top”>
<span class=”fmlabel”>Loan Amount:</span>
</td>
<td valign=”top” colspan=”2″ align=”right”>
<input class=”numbers” name=”S” size=”40″ value=””>
</td>
</tr>
<tr>
<td valign=”top”>
<span class=”fmlabel”>Yearly interest rates:</span>
</td>
<td valign=”top” colspan=”2″ align=”right”>
<input class=”numbers” name=”I” size=”40″ value=””>
</td>
</tr>
<tr>
<td valign=”top”>
<span class=”fmlabel”>Total Number of Monthly Payments:</span>
</td>
<td valign=”top” colspan=”2″ align=”right”>
<input class=”numbers” name=”N” size=”40″ value=””>
</td>
</tr>
<tr>
<!– BUTTONS TO CALCULATE OR RESET FORM –>
<td align=”center” colspan=”2″>
<input type=”submit” value=”Calculate”>
<input type=”reset” value=”Reset”>
</td>
</tr>
</table>
<hr align=”center” size=”3″ width=”100%” color=”black”>
<table width=”520″ valign=”top” align=”center” colspan=”2″>
<tr>
<td valign=”top”>
<span class=”fmlabel”>Monthly Payment:</span>
</td>
<td valign=”top” colspan=”2″ align=”right”>
<input class=”numbers” name=”Payment” size=”40″ value=”0.00″ disabled>
</td>
</tr>
<tr>
<td valign=”top”>
<span class=”fmlabel”>Total Payments:</span>
</td>
<td valign=”top” colspan=”2″ align=”right”>
<input class=”numbers” name=”Total” size=”40″ value=”0.00″ disabled>
</td>
</tr>