2

現在、最初の 2 つのフォームに入力されたデータに基づいて、毎年貯金額の表を生成する必要がある「退職金計算機」に取り組んでいます。残念ながら、テーブルがサイトに追加されない理由がわかりません。コンソールにエラーは表示されません。

私は JS/JQ の初心者でもあります。計算のコードは一番下にあります。私はそれがいたるところで少し見えるかもしれないことに気づきました.私は戻ってそれをきれいにする前に最初にそれを働かせようとしています.

編集:私はいくつかのメソッドを取り出したので、トラバースすることはあまりありません。計算に関与する変数が実際の値に設定されていると仮定します (別名、null/NaN ではありません)。たとえば、さらにシナリオを追加する add JQuery メソッドがあります。しかし、それは問題から気をそらすので、私はそれを取り除きました. しかし、for ループは配列に関連して実行されます。

var scenarioCount=0;
var hasError=false
var error=false;
var YOB;
var CurrSav;
var RetAge;
var LifeExp;
var Year;
var scenarios = new Array();

$(document).ready(function ()
{
    $('#calculate').on('click', function(e)
    {
        if(!isBasicInfoValid()) //check to see if basic info is correct
        {
            if(!error) //if there isn't already an error put one 
            {
                $('#basic').append($("<div class='basicError'>Input is not valid! </div>")); 
            }
            resetVars(); //reset the variables
            error=true; //say there is an error on screen
        }
        else
        {
            $("#basic .basicError").remove();   
            error=false;
            calculate();
        } 
        e.preventDefault();
    });
});
function calculate()
{
    var body = document.getElementById('body');
    //body is null right here for some reason

    $(body).append("<div id='results' class='form'>");
    for(var i=0;i<scenarios.length;i++)
    {
        var element = scenarios[i];
        var n = parseInt(YOB)+parseInt(RetAge)-Year;
        var m = LifeExp-RetAge;
        var r = 1+element.workRate;
        var g = 1 + element.retiredRate;
        var I = CurrSav;
        var T = element.retIncome;
        var part1 = (T/Math.pow(g,m-1))*((1-Math.pow(g,m))/(1-g))-(I*Math.pow(r,n));
        var S = part1*(1-r)/(1-Math.pow(r,n));
        var savings=I;
        $('#results').append("<div><h4>You need to save "+S+" dollars</h4></div>")
        $('#results').append("<table id=t><tr><th>Year</th><th>Money Saved</th></tr>");

        for(var j=n;j>0;j--)
        {
            savings=S+savings*r;
            $('#t').append("<tr><td>"+j+"</td><td>"+savings+"</td></tr>")
        }
        for(var j=m;j>0;j--)
        {
            savings=(savings-T)*g;
            $('#t').append("<tr><td>"+j+"</td><td>"+savings+"</td></tr>")
        }
        $('#results').append("</table></div>");
    }   
};
function resetVars()
{
    YOB=null;
    CurrSav=null;
    RetAge=null;
    LifeExp=null;
    Year=null;
}
function scenarioObject()
{
    var obj={
        nameScen : document.forms["scenario"]["ScenarioName"].value,
        workRate : document.forms["scenario"]["Working"].value,
        retiredRate : document.forms["scenario"]["Retired"].value,
        retIncome : document.forms["scenario"]["desiredInc"].value
    }
    return obj;
}

<!DOCTYPE html>
<html>
<head>
    <title>Assignment 3</title>
    <link rel='stylesheet' type='text/css' href='/uncSemester7/comp426/a3/assignment3.css'>
    <script src='/uncSemester7/comp426/a3/jquery-1.10.2.js'></script>
    <script src='/uncSemester7/comp426/a3/assignment3.js'></script>
</head>
<body>
    <div class='form'>
        <h3> Basic Information </h3>
        <form id='basic'>
            <div>Year of Birth: <input type='number' name='YOB'> </div> 
            <div>Current Savings: <input type='number' name='CurrSav'> 
            </div>  
            <div>Expected Retirement Age: <input type='number' name='RetAge'></div>     
            <div>Life expectancy: <input type='number' name='LifeExp'>
            </div>  
        </form>
    </div>
    <div id='scenDiv' class='form'>
        <div id='buttons'>
            <div><button id='add' type='submit'>Add Scenario </button></div>
            <div><button id='calculate' type='submit'> Calculate </button></div>
        </div>
        <h3> Scenario </h3>
        <form id='scenario'>
            <div>Name: <input type='text' name='ScenarioName'> </div>
            <div>Rate of Investment Return (While Working): <input type='number' name='Working'></div>
            <div>Rate of Investment Return (Retired): <input type='number' name='Retired'></div>
            <div>Desired Retirement Yearly Income: <input type='number' name='desiredInc'></div>
        </form>     
    </div>
</body>
</html>
4

1 に答える 1