Reputation: 11

Button in Javascript code not computing equation

I have my code all written but when I run the webpage the button simply does not compute the answer and send the string to the Monthly Payment text box. This is a monthly payment calculator using HTML and Javascript. I have no idea what I am doing wrong, any help is appreciated.

I am using netbeans 8 and I get an error code everytime Chrome opens it about debugging. I'm unsure if my code is correct and the browser just isnt running the function or if my code is incorrect. I feel like my error is something very small.

<!DOCTYPE html>
<html>
    <head>
        <title>Monthly Payment Calculator</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>

    <body>
        <form name="mpForm" action=""> 
                <table border="0">
                    <tbody>
                        <tr>
                            <td>Enter Loan:</td>
                            <td><input id='loanAmt' type="text"  name="loanAmt" value="" /></td>
                        </tr>
                        <br>
                        <tr>
                        <td>Select Rate</td>
                        <td><select name="Rate">
                            <option value=.04>3%</option>
                            <option value=045>3.5%</option>
                            <option value=.05 >4%</option>
                            <option value=.055>4.5%</option>
                            <option value=.06>5%</option>
                            <option value=.055>5.5%</option>
                            <option value=.06>6%</option>
                            </select></td>
                        </tr>
                        <tr>
                            <td>Select Year</td>
                            <td><input type="radio" name="Year" value=10 />10 year<br>
                            <input type="radio" name="Year" value=15 />15 year<br>
                            <input type="radio" name="Year" value=30 />30 year<br>
                            </td>
                        </tr>
                        <tr>
                            <td>Monthly Payment: </td>
                            <td><input type="text" name="MP"  /></td>
                        </tr>
                        <tr>
                            <td><input type="button" value=“computeMP" name="btnCompute" onClick=“computeMP()" /></td>
                        </tr>
                </tbody>
            </table> 
        </form>
<script>
function computeMP(){
myLoan=parseFloat(document.mpForm.loanAmt.value);
myRate=parseFloat(document.mpForm.Rate.options[document.mpForm.Rate.selectedIndex].value);
if (document.mpForm.Year[0].checked)
    {myYear=10;}
else if (document.mpForm.Year[1].checked)
    {myYear=15;}
else
    {myYear=30;}
MP=(Loan * (myRate/12))/1-Math.pow(1+(myRate/12),-12*myYear));
document.mpForm.mp.value=MP.toString(); 
}
</script>

    </body>
</html>

I expect the output to solve the equation as outlined in the MP variable

Upvotes: 0

Answers (2)

Chizzele

Reputation: 292

You just had a few syntax errors, this should work :)

<!DOCTYPE html>
<html>
    <head>
        <title>Monthly Payment Calculator</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>

    <body>
        <form name="mpForm" action="">
                <table border="0">
                    <tbody>
                        <tr>
                            <td>Enter Loan:</td>
                            <td><input id='loanAmt' type="text"  name="loanAmt" value="" /></td>
                        </tr>
                        <br>
                        <tr>
                        <td>Select Rate</td>
                        <td><select name="Rate">
                            <option value=.04>3%</option>
                            <option value=045>3.5%</option>
                            <option value=.05 >4%</option>
                            <option value=.055>4.5%</option>
                            <option value=.06>5%</option>
                            <option value=.055>5.5%</option>
                            <option value=.06>6%</option>
                            </select></td>
                        </tr>
                        <tr>
                            <td>Select Year</td>
                            <td><input type="radio" name="Year" value=10 />10 year<br>
                            <input type="radio" name="Year" value=15 />15 year<br>
                            <input type="radio" name="Year" value=30 />30 year<br>
                            </td>
                        </tr>
                        <tr>
                            <td>Monthly Payment: </td>
                            <td><input type="text" name="mp"  /></td>
                        </tr>
                        <tr>
                            <td><input type="button" value="computeMP" name="btnCompute" onClick="computeMP()" /></td>
                        </tr>
                </tbody>
            </table>
        </form>
<script>
function computeMP(){
myLoan=parseFloat(document.mpForm.loanAmt.value);
myRate=parseFloat(document.mpForm.Rate.options[document.mpForm.Rate.selectedIndex].value);
if (document.mpForm.Year[0].checked)
    {myYear=10;}
else if (document.mpForm.Year[1].checked)
    {myYear=15;}
else
    {myYear=30;}
MP=(myLoan * (myRate/12))/1-Math.pow(1+(myRate/12),-12*myYear);
console.log(document);
document.mpForm.mp.value=MP.toString();
}
</script>

    </body>
</html>

Upvotes: 0

Hien Nguyen

Reputation: 18975

There is some error in your source code:

Have strange character in button "computeMP"
Name is MP but use as mp
Variable is myLoan but use with Loan

Here is source code worked

  function computeMP() {
            myLoan = parseFloat(document.mpForm.loanAmt.value);
            myRate = parseFloat(document.mpForm.Rate.options[document.mpForm.Rate.selectedIndex].value);
            if (document.mpForm.Year[0].checked) { myYear = 10; }
            else if (document.mpForm.Year[1].checked) { myYear = 15; }
            else { myYear = 30; }
            MP = (myLoan * (myRate / 12)) / 1 - Math.pow(1 + (myRate / 12), -12 * myYear);
            document.mpForm.MP.value = MP.toString();
        }

<!DOCTYPE html>
<html>

<head>
    <title>Monthly Payment Calculator</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

<body>
    <form name="mpForm" action="">
        <table border="0">
            <tbody>
                <tr>
                    <td>Enter Loan:</td>
                    <td><input id='loanAmt' type="text" name="loanAmt" value="" /></td>
                </tr>
                <br>
                <tr>
                    <td>Select Rate</td>
                    <td><select name="Rate">
                            <option value=.04>3%</option>
                            <option value=045>3.5%</option>
                            <option value=.05>4%</option>
                            <option value=.055>4.5%</option>
                            <option value=.06>5%</option>
                            <option value=.055>5.5%</option>
                            <option value=.06>6%</option>
                        </select></td>
                </tr>
                <tr>
                    <td>Select Year</td>
                    <td><input type="radio" name="Year" value=10 />10 year<br>
                        <input type="radio" name="Year" value=15 />15 year<br>
                        <input type="radio" name="Year" value=30 />30 year<br>
                    </td>
                </tr>
                <tr>
                    <td>Monthly Payment: </td>
                    <td><input type="text" name="MP" /></td>
                </tr>
                <tr>
                    <td><input type="button" value="computeMP" name="btnCompute" onClick="computeMP()" /></td>
                </tr>
            </tbody>
        </table>
    </form>

</body>

</html>

Upvotes: 1

Button in Javascript code not computing equation

Answers (2)

Related Questions