Declared variable returns 'undefined'

Question

I have tried everything I can think of to resolve the fact that my variable is returning 'undefined'.

I have gone console.log crazy checking everything is working as it should be and am now up against the proverbial brick wall.

The script is located just before the closing body tag.

I tried putting it in the head section of the page but this began returning NaN on the variables R and X.

Putting the variables just after the opening script tag before calling the function did likewise. I am somewhat new to javascript and would very much appreciate any help.

function DisplayInputValues() {

    var funds = document.getElementById("funds").value;
    var s = document.getElementById("sum").innerText;
    var j = document.getElementById('debt').value; //number of input fields

    var txtin; //class name of text input element
    var numin; // class name of number input element

    var L = 0;

    while (L < j) {

        console.log('funds= ' + funds); //just checking amount of funds shows correctly 
        console.log('debt = ' + s); //just checking Debt sum shows correctly
        console.log('Loop = ' + L);

        var userinput1 = document.getElementsByClassName('txtin')[L].value;
        console.log('Loop = ' + L + ' Text input = ' + userinput1);
        document.getElementById("showresults").innerHTML += userinput1 + "<br />";

        var userinput2 = document.getElementsByClassName('numin')[L].value;
        console.log('Loop = ' + L + ' Number input = ' + userinput2);
        document.getElementById("showresults").innerHTML += userinput2 +
            "<br/>" + 'Amount To Offer : ' + X + "<br />" + "<br />";

        var FP = funds / 100; // 1% of funds available
        var SP = s / 100; // 1% of debt total  
        var R = userinput2 / SP;
        R = R.toFixed(2);
        var X = FP * R;
        X = X.toFixed(2); //amount to offer in settlement

        console.log('Loop = ' + L + ' FP = ' + FP);
        console.log('Loop = ' + L + ' SP = ' + SP);
        console.log('Loop = ' + L + ' R = ' + R);
        console.log('Loop = ' + L + ' X = ' + X);
        console.log('Loop = ' + L + ' Amount to offer = ' + X);
        console.log('');

        L = L + 1;
    }
}

Answer 1

Output everything after calculation

X is used before you declared it. In your original code you had

document.getElementById("showresults").innerHTML += userinput2 + "<br/>" + 'Amount To Offer : ' + X + "<br />" + "<br />";

before X was declared so of course it is going to give you undefined

I have changed the order of things so that X is first calculated then used

    var userinput1 = document.getElementsByClassName('txtin')[L].value;
    var userinput2 = document.getElementsByClassName('numin')[L].value;

    var FP = funds / 100; // 1% of funds available
    var SP = s / 100; // 1% of debt total  
    var R = userinput2 / SP;
    R = R.toFixed(2);
    var X = FP * R;
    X = X.toFixed(2); //amount to offer in settlement

    console.log('Loop = ' + L + ' Text input = ' + userinput1);
    document.getElementById("showresults").innerHTML += userinput1 + "<br />";

    console.log('Loop = ' + L + ' Number input = ' + userinput2);
    document.getElementById("showresults").innerHTML += userinput2 +
        "<br/>" + 'Amount To Offer : ' + X + "<br />" + "<br />";