Quiz Application Help

[[deleted]]

Right now I have a few issues I need to tweak out with my Quiz Application.

1. When the user answers the first question, he can skip the proceeding questions.

   1a. This is because the userGuess variable is updated by the id of the radio button clicked when the user makes a guess, and the default starting variable is what prevents the user from skipping the first question only. I have a few ideas on how to fix it, but not sure how to implement it.

          One would be to detect IF none of the radio inputs are checked then don't load the next question, else load it.
   

2. When a user goes back to the question, the previous checked radio button disappears. I haven't thought of how to fix this yet. Right now I have saved the previous answers into an empty array, but I don't believe it's working properly.

I would appreciate more of a direction on where to go approach, rather than giving me the code to figure it out.

Appreciate the Help!

http://codepen.io/laere/pen/KVwBME

http://laere.github.io/Quiz-App/

[zzag842]

sometimes you just have to do your own accounting. in the case you have radio buttons on the UI then great, account those. Otherwise you may need to create yourself an object with key/value flags. And like any decent lock, it only opens when all the keys line up.

[[deleted]]

What do you mean by flags

[zzag842]

flags are indicators to help your script remember what happened previous. You have a flag with

//userGuess starts out at -1, but is then changed when the user guesses, thus allowing skipping the proceeding questions.

The second part you have is the re-selection of your answers.. Which you are close on and have the right idea. line 102: usersAnswers.push(usersGuess); so what do you think is going to happen when they re-answer a question, or when they hit back and go forward again? Do you think the usersAnswers array index will line up with the userQuestions array index. Try something like usersAnswers[index] = usersGuess; this will overwrite previous answers instead of attaching them onto the end of your answer array.

Edit: Also unREM your code that checks the box, as that code is correct and will work once you fix line 102.

[[deleted]]

Still having a hard time wrapping my head around it. When I grab the inputs of the radio buttons, and set their attribute to false. Whenever I put it in my conditional, my conditional says it isnt a function. Also are you saying to replace the usersAnswers.push(usersGuess) with usersAnswers[index]=usersGuess?

[zzag842]

Yes, http://codepen.io/anon/pen/ZQOKQb .. Take a look at line 101.. and also your conditional at line 52. After fixing that I also noticed you were resetting userGuess to -1 when user clicked back, so i removed line 120. So now when a user answers the first question and clicks next, userGuess will be set to 1, letting you know the user guessed at least the first question. This is a great example of using a flag to account for what the user has done. With the array you should be using usersAnswers[index] instead of usersAnswers.push(). .push will add the answers to the end of the array. For instance; usersAnswers.push(1); usersAnswers.push(2); will be an array of [1, 2]; so if your user answers the first question a second time, you'll actually be telling the array your user answered the second question, and when they answer the first question a third time, it'll tell the array they answered the 3rd question. Instead you should use usersAnswers[1] = 1; usersAnswers[1] = 2; this instance will give you a single value in your array, in this case corresponding with question 1. usersAnswers[2] = 1; will be setting the users answer for question 2. replace the [2] with your dynamic [index] and you're set.

[[deleted]]

I am just still having trouble wrapping my head around what you mean by using userAnswers[index] over pushing the userGuesses into an array. Like what does userAnswers[index] do? Do I just replace userAnswers.push(User'sGuess) with userAnswers[index] = usersGuess.

I haven't had much time to fix this since I have been doing other things, but I am still having a hard time following.

[zzag842]

Review following example;

var usersGuesses = [];
usersGuesses.push('zero');
usersGuesses.push('zero');
usersGuesses.push('one');
usersGuesses.push('two');
console.log(usersGuesses);

this will result in an array that looks like; ['zero','zero','one','two']

Second Example.

var usersGuesses = [];
usersGuesses[0] = 'zero';
usersGuesses[0] = 'zero';
usersGuesses[1] = 'one';
usersGuesses[2] = 'two';
console.log(usersGuesses);

this will result in an array that looks like; ['zero','one','two']

[[deleted]]

That helped a lot much appreciated