CODEWITHSUNDEEP
javascriptarraysformsinput
lindsey
lindsey

Reputation: 59

How to store user input in Array

I'm trying to create a sort of math quiz which prompts the user to answer one question before moving onto the next. At the end of the quiz, a popup window should list all of the problems along with the user's answers to each problem. I have it pretty much in place, but I can't figure out how to store each of the user's answers into an array in order to display these answers in the popup window. Any help would be greatly appreciated!

HTML:

<body>
    <form>
        <table id="addProblem" width="150" border="0" cellspacing="0" cellpadding="10">
  <tr>
    <td>&nbsp;</td>
    <td colspan="1" align="right"><input id="carryOver"></td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td colspan="2" align="right" id="firstNum">48</td>
  </tr>
  <tr>
    <td>+</td>
    <td colspan="2" align="right" id="secondNum">16</td>
  </tr>
  <tr>
    <td colspan="3"><hr id="sepLine"></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td colspan="2" align="right"><input id="userAnswer" type="text"></td>
  </tr>
  <tr>
      <td colspan="3"><input type="button" onclick="submitAnswer()" value="Submit" /></td>
  </tr>
</table>
    </form>
</body>
</html>

JavaScript:

// first number in addition problem
var numOne = [48,39,16,43,37,23,44,13,37,28,48,16];   

// second number in addition problem
var numTwo = [16,22,25,18,46,49,18,39,25,17,9,28];

// counter variable
var i = 0;

function submitAnswer() {
    // validate the answer was a number
    var guessed = Number(document.getElementById('userAnswer').value);
    var checkAnswer = 'Correct!';

    // if the answer is incorrect, change result to Incorrect
    if (guessed != numOne[i]+numTwo[i]) {
        checkAnswer = 'Incorrect!\nThe answer is'+' '+Number(numOne[i]+numTwo[i])+'.';
    }
    // will show the string in the result variable
    if(confirm(checkAnswer) && i<1) {
        // next question
        i++;
        document.getElementById('firstNum').innerHTML=numOne[i];
        document.getElementById('secondNum').innerHTML=numTwo[i];

        // reset the answer and carry over to blank
        document.getElementById('userAnswer').value = '';
        document.getElementById('carryOver').value = '';
    } else if(i=1) {
        var results=window.open('','name','height=400,width=500');

        results.document.write('<html><head><title>Results</title>');
        results.document.write('<link rel="stylesheet" href="style.css">');
        results.document.write('</head><body>');
        results.document.write('1) '+numOne[0]+' + '+numTwo[0]+' = ' + 'user input for Problem 1');
        results.document.write('<br>');
        results.document.write('2) '+numOne[1]+' + '+numTwo[1]+' = ' + 'user input for Problem 2');
        results.document.write('<p><a href="javascript:self.close()">Close</a> the popup.</p>');
        results.document.write('</body></html>');
        results.document.close();
    }
}

Upvotes: 2

Views: 4436

Answers (1)

nicael
nicael

Reputation: 18997

var answers = [];
answers.push(document.getElementById('userAnswer').value); //or something else to push

And replace if(i=1) with if(i==1)

Upvotes: 2

Related Questions