call Function failing to work

Question

I'm writing a simple javscript program, and on submit button i'm calling the find_amount() function, however i keep on getting " ReferenceError: find_amount is not defined". What am i doing wrong?I've tried several things but couldn't get it to work, though i tried this method several times before and it worked perfectly.

<form id="myForm">

    <strong>Loan: <input type="text" name="loan" id="loan" value="" size="10"></strong>&nbsp;&nbsp;
    <select id="duration" onclick="onSelectChange(this)" style="width: 85px">
        <option value=" "></option>
        <option value="three">3 years</option>
        <option value="five">5 years</option>
        <option value="six">6 years</option>
    </select> &nbsp;&nbsp;
    <strong>Interest: <input type="text" name="interest" id="interest" value="" size="10"></strong>
    <button type="button" onclick="find_amount();">Submit</button></br></br>
    <strong>Total amount to be returned: <input type="text" name="return" id="return" value="" size="10"></strong></br></br>
    <strong>Installments</strong>
    <select id="installments" onclick="onSelectChange(this)" style="width: 85px">
        <option value=" "></option>
        <option value="year">per year</option>
        <option value="month">per month</option>
        <option value="week">per week</option>
        <option value="day">per day</option>
    </select> &nbsp;&nbsp;<strong>:</strong>
    <span id="final"></span>
</form>

JavaScript:

function onSelectChange(combo) {

    switch (combo.value) {
        case "three":
            {
                document.getElementById("interest").value = " 3% ";
                break;
            }
        case "five":
            {
                document.getElementById("interest").value = " 5% ";
                break;
            }
        case "six":
            {
                document.getElementById("interest").value = " 6% ";
                break;
            }

        case " ":
            {
                document.getElementById("interest").value = " ";
                break;
            }

    }
    function find_amount() {
        var total;
        var inter;
        var lo;

        lo = document.getElementById("loan").value;
        inter = document.getElementById("interest").value;
        total = (lo * inter) / 100;
        alert(total);
        //document.getElementById("return").value = total;
    }
}

Answer 1

You are "missing" the closing bracket of onSelectChange(combo) {... function before find_amount() {...}. You closed it after the function.

So the function find_amount is defined/nested in onSelectChange(combo), thats why it's not visible in global scope outside of onSelectChange

I formatted the Code with Visual Studio and edited to your post. Using such an Editor helps to avoid such mistakes.

Thats how it should look like:

function onSelectChange(combo) {

    switch (combo.value) {
        case "three":
            {
                document.getElementById("interest").value = " 3% ";
                break;
            }
        case "five":
            {
                document.getElementById("interest").value = " 5% ";
                break;
            }
        case "six":
            {
                document.getElementById("interest").value = " 6% ";
                break;
            }

        case " ":
            {
                document.getElementById("interest").value = " ";
                break;
            }

    }
}

function find_amount() {
    var total;
    var inter;
    var lo;

    lo = document.getElementById("loan").value;
    inter = document.getElementById("interest").value;
    total = (lo * inter) / 100;
    alert(total);
    //document.getElementById("return").value = total;
}

Answer 2

Your find_amount() function is defined within your onSelectChange() function, and it is not visible to anyone outside that function. Try to separate the two functions like so:

JS

function onSelectChange(combo) {

    switch(combo.value) {
        case "three" : 
        {   
            document.getElementById("interest").value = " 3% ";
            break;
        }
        case "five" : 
        {   
            document.getElementById("interest").value = " 5% ";
            break;
        }
        case "six" : 
        {   
            document.getElementById("interest").value = " 6% ";
            break;
        }

        case " " : 
        {   
            document.getElementById("interest").value = " ";
            break;
        }

    }
}
function find_amount(){
    var total;
    var inter;
    var lo;

    lo = document.getElementById("loan").value;
    inter = document.getElementById("interest").value;
    total = (lo * inter)/100;
    alert(total);
    //document.getElementById("return").value = total;
}