javascript parallel array with user input for name and numeric value

Question

I am a beginner in javascript, I am learning arrays. I am working on creating a html interface with javascript to use parallel arrays to obtain a users name and numeric value for each user (Score) I am stuck on understanding how I can save users input in each of the new arrays I created for each input. I have a button to save each name and score entry then I want to create a summary output that will check each score input and pass it through a loop to assign it a category such as A, B, C. I haven't gotten that far as I am confused on how to store each input in their array. The examples provided to me and the ones I found use predetermined values vs user input. This is what I have so far.

    <h1>Grades</h1>
</header>
<br>
<p><b>Student Name:</b></p>
<input id="inp" type="text">
<br>
<br>
<p><b>Test Score:</b></p>
<input id="inps" type="text">
<br>
<br>
<br>
<button type="button" onclick="enter()">Enter</button>
<br>
<br>
<button type="button" onclick="summ()">Summary</button>
<br>
<p id="iop"></p>
<br>
<script>
    var studentArr = new Array();
    var scoreArr = new Array();

    function enter() {

        var studentName = document.getElementById("inp").value;
        studentArr.push(inp);

        var stuval = "";

        for(i=0; i < studentArr.length; i++)
        {
            stuval = stuval + studentArr[i] + "<br/>";
        }

        document.getElementById("iop").innerHTML = stuval;

        var studentScore = document.getElementById("inps").value;
        scoreArr.push(inps);

        var scoreval = "";

        for(i=0; i < scoreArr.length; i++)
        {
            scoreval = scoreval + scoreArr[i] + "<br/>";
        }


    }
</script>

user4074041 · Accepted Answer · 2017-04-18 04:42:43Z

1

I belive more easier way exists:

var students = new Array();

function enter() {
    students.push({
        name: document.getElementById("inp").value,
        score: document.getElementById("inps").value
    });
    show();
}

function show() {
    document.getElementById("iop").innerHTML = "";
    students.forEach(x => {
        document.getElementById("iop").innerHTML += x.name + "<br/>";
    });
}

answered Apr 18, 2017 at 4:42

user4074041

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

Comments

aaronw · Accepted Answer · 2017-04-18 04:37:15Z

0

You aren't using the right variable when pushing to your array here

studentArr.push(inp);

and here

scoreArr.push(inps);

Those variables do not exist in your code. You've defined 'studentName' and 'studentScore' so use them and you should have some data in your arrays.

answered Apr 18, 2017 at 4:37

aaronw

1562 silver badges9 bronze badges

Collectives™ on Stack Overflow

javascript parallel array with user input for name and numeric value

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related