value of undefined for input element using JavaScript

Question

I am retrieving the values of some input elements using this JavaScript below. There are two input elements; if I enter values in both and press the button to use/display the values, only the second element has a value. The first element maintains the value undefined no matter what is entered. I've tried using/displaying this value many ways it seems to only be undefined. Check out the code:

<!DOCTYPE html>
<html>
<head>
    <title>Stock Portfolio</title>
</head>
<body>
    <table>
        <tr><th>Enter Stock Portfolio Data</th></tr>
        <tr><td>Name of stock:</td>
        <td><input id="stk"></td></tr>
        <tr><td>Amount of shares:</td>
        <td><input id="shares"></td></tr>
        <tr><th>Press button to add new stock to your portfolio:</th>
        <td><button onclick="addstock();">Add</button></td></tr>
        <tr><th>Press button to calculate value of your stocks:</th>
        <td><button onclick="getvalue();">Calculate</button></td></tr>
        <tr><td>Value of Stocks:</td>
        <td><span id="stockvalues"></span></td></tr>
    </table>
<!-- JavaScript code for stock portfolio -->
<script>
    //"use strict";

    // stock portfolio

    var portfolio = {}; // portfolio object

    var name   = document.getElementById("stk");
    var qty    = document.getElementById("shares");
    var values = document.getElementById("stockvalues");

    // function that adds stock properties and amount of shares to portfolio object
    function addstock() {
        // here's the code I want to use here
        // I've tried just displaying the value of name.value, but that is undefined
        // so the value will be the name for the object's properties
        portfolio[name.value] = qty.value;
    }

    //  function that gets the current price of stocks
    function getquote(stock) {
        // does nothing for now
    }

    // function that calculates value of shares in stocks and returns that value
    function displaystocks() {
        var result = []; // The array we will return

        for(var prop in portfolio) { // For all enumerable properties
            result.push(prop); // add it to the array.
        }
        values.innerHTML = result;
    }

    // function that calculates value of shares in stocks and returns that value
    function getvalue() {
        var total = 0;

        for(var stock in portfolio) { // For each stock in the portfolio:
            var numshares = portfolio[stock]; // get the number of shares
            var price = 10; // Could CALL FUNCTION -- getquote(stock);  look up share price

            total += numshares * price; // add stock value to total value
        }
        values.innerHTML = total;
    }
</script>
</body>
</html>

Kaiido · Accepted Answer · 2015-01-12 02:36:13Z

1

It is because you called your variable name.
This name is actually referring to window.name (the name of the window).

If you rename your variable to something else like stk, it will work :

var stk = document.getElementById("stk");

portfolio[stk.value] = qty.value;

answered Jan 12, 2015 at 2:36

Kaiido

140k15 gold badges266 silver badges333 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

value of undefined for input element using JavaScript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related