zero vacpls
zero vacpls

Reputation: 115

Javascript can't get values from input

I'm trying to get the values from the inputs in my form with JavaScript. But whenever I hit submit, I either get nothing, 0 or undefined. Mostly undefined. It doesn't seem to get any of the values.

Here's the code

<form id="ecoCalculator">
        <div class="form-group">
            <label for="k0">Start Kapital</label>
            <input type="number" name="k0" class="form-control" id="k0">
        </div>

        <div class="form-group">
            <label for="kn">Slut Kapital</label>
            <input type="number" name="kn" class="form-control" id="kn">
        </div>

        <div class="form-group">
            <label for="x">Rente</label>
            <input type="number" name="x" class="form-control" id="x">
        </div>

        <div class="form-group">
            <label for="n">Terminer</label>
            <input type="number" name="n" class="form-control" id="n">
        </div>

        <div class="ecoButtons">
            <input type="button" value="Udregn" class="btn btn-default" onclick="k0Eco()">
            <input type="reset" value="Ryd" class="btn btn-default">
        </div>

    </form>

    <div class="ecoResult">
        <p id="ecoResult">Resultat</p>
    </div>

</div>

<script type="text/javascript">
        // Public Variables
        var k0 = document.getElementById('k0').value();
        var kn = document.getElementById('kn').value();
        var x = document.getElementById('x').value();
        var n = document.getElementById('n').value();

        // Calculation of Initial Capital
        function k0Eco() {
            // Calculation
            var k0Value = kn / (1 + x) ^ n;
            // Show Result
            document.getElementById("ecoResult").innerHTML = k0;
        }

I've looked around at different questions but haven't found a solution to this yet.

I've tried to change the names of the inputs, having the function only display a single value, but still no result.

Thanks

Upvotes: 1

Views: 4581

Answers (3)

Paulo Pereira
Paulo Pereira

Reputation: 1115

  • Use value instead of value(). It is a property not a function.

  • Put your variables inside your function. When page loads you variables are getting the value of the inputs and there is nothing there.

function k0Eco() {
    var k0 = document.getElementById('k0').value;
    var kn = document.getElementById('kn').value;
    var x = document.getElementById('x').value;
    var n = document.getElementById('n').value;

    var k0Value = kn / (1 + x) ^ n;

    document.getElementById("ecoResult").innerHTML = k0Value;
}
  • Put you javascript code inside <head> tag or at least before the button. When you try to fire onclick() event, your function is not created yet.

Upvotes: 0

Shobhit Walia
Shobhit Walia

Reputation: 496

you need to parse the input value in int. for eg.

// Public Variables
    var k0 = parseInt(document.getElementById('k0').value);
    var kn = parseInt(document.getElementById('kn').value);
    var x = parseIntdocument.getElementById('x').value);
    var n = parseIntdocument.getElementById('n').value);

Upvotes: 0

baao
baao

Reputation: 73301

value isn't a function, it's a property. Change

var k0 = document.getElementById('k0').value()

to

var k0 = document.getElementById('k0').value

Your script also runs on page load, so nothing is filled yet. You need to put the whole thing in a submit handler:

document.getElementById('ecoCalculator').addEventListener('submit', function(e) {
    e.preventDefault();
    // your code here

});

Now remove the inline js from the button and make it type submit:

<input type="submit" value="Udregn" class="btn btn-default" />

And remove the function in your js

var k0 = document.getElementById('k0').value;
var kn = document.getElementById('kn').value;
var x = document.getElementById('x').value;
var n = document.getElementById('n').value;

// Calculation
var k0Value = kn / (1 + x) ^ n;
// Show Result
document.getElementById("ecoResult").innerHTML = k0Value;

Here's a working fiddle

Upvotes: 1

Related Questions