Javascript Help

goldy30

goldy30

New Member
Messages
60
Reaction score
0
Points
0
I'm not very good at debugging although I've gone over it till by eyes started bleeding. It seems right but its not even calculating onClick??



Could someone tell me where I went wrong so I know?


INVESTMENT



Create an application that allows a Customer to enter an initial deposit (for example $100), an annual interest rate (say 12%, which is 1% per month) and a target savings amount (say $200). Determine how many months it will take for the customer to reach this target amount.
Save your program as investment.htm

what i've done:
HTML: 
<html>
<head></head>
<body>

<script type="text/javascript">
function calc(){

var deposit = parseFloat(document.form_invest.deposit.value);
var percent = parseFloat(document.form_invest.percent.value)/12/100;
var target = parseFloat(document.form_invest.target.value);
var months = 0;

if (deposit < target){
    deposit = deposit + deposit * percent;
    months++;
    }

document.getElementById("disp").innerHTML = "Your investment will take " + parseFloat(months) + " months to reach your target amount.";
}
</script>
<center>
    <form name="form_invest">
        <table class="text" cellpadding="5">
            <tr>
                <td colspan="2" align="center"><b style="color:red">How much will you invest?</b></td>
            <tr>
                <td align="right">Deposit:    </td><td><input type="text" name="deposit" size="3"></td>
            </tr>
            <tr>
                <td align="right">Iterest Rate:</td><td><input type="text" name="percent" size="3">% </td>
            </tr>
            <tr>
                <td align="right">Target Amount:</td><td><input type="text" name="target" size="3"></td>
            </tr>
            <tr>
                <td colspan="2" align="center"><input type="button" value="Calculate" onClick="calc"></td>
            <tr>
            <tr>
                <td colspan="2" align="center"><div id="disp" style="color:#ffffff;"></div></td>
            <tr>
        </table>
    </form>
</center>

</body>
</html>
 
xPlozion

xPlozion

New Member
Messages
868
Reaction score
1
Points
0
i haven't gotten the time to test it, but as far as debugging goes, if you've got firefox installed, get the web developer extension, as it has a built in error console which displays any javascript errors.

by the way, is this an assignment for school or something?

----------

OK, I found out why the function was never called to. instead of it being onclick='calc', it needs to be onclick='calc()'.

but no matter what i have the value set to ($1, 1%, target: $1000), it always says that it's going to take 1 month. that's because of the if() command. it only checks it once. for recursive commands (one that will continue until the requirement is met), use while or for (while in our case).

The following code works as planned:
HTML: 
<html>
<head></head>
<body>

<script type="text/javascript">
<!--
function calc()
{

    var deposit = parseFloat(document.form_invest.deposit.value);
    var percent = parseFloat(document.form_invest.percent.value)/12/100;
    var target = parseFloat(document.form_invest.target.value);
    var months = 0;

    while (deposit < target)
    {
        deposit = deposit + (deposit * percent);
        months++;
    }

    document.getElementById("disp").innerHTML = "Your investment will take " + parseFloat(months) + " months to reach your target amount.";
}
-->
</script>
<center>
    <form name="form_invest">
        <table class="text" cellpadding="5">
            <tr>
                <td colspan="2" align="center"><b style="color:red">How much will you invest?</b></td>
            <tr>
                <td align="right">Deposit:</td><td><input type="text" name="deposit" size="3"></td>
            </tr>
            <tr>
                <td align="right">Iterest Rate:</td><td><input type="text" name="percent" size="3">%</td>
            </tr>
            <tr>
                <td align="right">Target Amount:</td><td><input type="text" name="target" size="3"></td>
            </tr>
            <tr>
                <td colspan="2" align="center"><input type="button" value="Calculate" onclick="calc()"></td>
            <tr>
            <tr>
                <td colspan="2" align="center"><div id="disp" style="color:#ffffff;"></div></td>
            <tr>
        </table>
    </form>
</center>

</body>
</html>

Please be generous and donate credits
 
Last edited:
natsuki

natsuki

New Member
Messages
112
Reaction score
0
Points
0
O_O

having a first look at your code if (deposit < target) is suspicious, because the result will always be the same no matter what the amounts are (unless deposit >= target) since you only pass to it once. Then your click should be click(); on the onclick because click alone denotes a variable while click() a function.

If you want to be bug safe then you could add some additional safety checks. in percent for example, you only calculate if percent > 0 else you'll end up in an infinite loop if you ever do looping since deposit will always be less than target if it is already initially so.
 
Last edited:
You must log in or register to reply here.
Top