Javascript loop with event action listeners and buttons

Question

I am trying to write an app that has a multiple choice quiz in it. I am writing it in a simple and somewhat hardcoded way. I have created an array of questions and a 2-d array of answers as my "database". My problem is that when i am iterating over the loop, my app immediately goes to the last question, even though if statements that in an ideal world should let the user interact with every questions.

my while loop is

var i = 0;

while i<10 then
   make the question view
   make the answer view
   make the answers clickable
   calculate scoring
   if the next button is pushed and i < 8 then i+=1 
   /*this prevents the app from building but when i put the i+=1 outside this control statement it goes directly to the last question in my database*/

end While

any ideas? my code is really long and do not know if i should post it

Could you post your real code example, not pseudo code? I suspect you made quite common mistake with javascript loops. Few other questions about it: http://stackoverflow.com/questions/750486/javascript-closure-inside-loops-simple-practical-example http://stackoverflow.com/questions/1451009/javascript-infamous-loop-issue — daniula, Apr 29 '14 at 19:23
There might be issues with closures in there, but I suspect this is a more base algorithmic problem he's having. — Dawson Toth, Apr 29 '14 at 19:45

score 0 · Answer 1 · answered Apr 29 '14 at 19:44

Rather than doing it all in a while loop, you should take a slightly different approach.

Create a function that does the while-loop-block above, and use a variable to keep track of the currently displayed question and answer. Then when the user clicks next, advance to the next pair, until the user is done.

var current = 0, until = 10;
function showCurrent() {
    // make the question view
    // make the answer view
    // make the answers clickable
    // calculate scoring
}

function goToNext() {
    current += 1;
    if (current === until) {
        // carry on with whatever is next
    }
    else {
        showCurrent();
    }
}

showCurrent();

Javascript loop with event action listeners and buttons

1 Answers1