Review Algorithmic Thinking by Building a Dice Game - Step 10

Tell us what’s happening:

I’m so lost on what I’m supposed to do here, the console comes up saying it cannot read properties of undefined and is pointing to value being undefined but I don’t really know why, I thought the find method would be the best method to check if an input is checked because it returns the first element that matches the condition, but I might be wrong

Your code so far

<!-- file: index.html -->

/* file: styles.css */

/* file: script.js */
// User Editable Region

keepScoreBtn.addEventListener("click", () => {
  const scoreInputsArr = [...scoreInputs];
  const isChecked = scoreInputsArr.find(score => score === score.checked);
  const isCheckedValue = isChecked.value;
  const isCheckedId = isChecked.id;
  if (isChecked) {
    updateScore(isCheckedValue, isCheckedId);
    resetRadioOptions;
    scoreHistory.innerHTML += `<li>${isCheckedId} : ${isCheckedValue}</li>`
  } else {
    alert("Please select an option") 
  }
})

// User Editable Region

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/140.0.0.0 Safari/537.36

Challenge Information:

Review Algorithmic Thinking by Building a Dice Game - Step 10

Choosing the find method to tackle this is correct, but your logic is flawed. If score is checked what will it return?

will it return true?

You can test that by looping over your scoreInputsArr and writing console.log(score.checked) inside it.

it returns false on the unchecked radio buttons, and true on the checked radio button, is the problem that you can’t use the value property or id property on a variable that returns a boolean?

The problem is your logic inside the find method. Use what you just learned to fix that.

I’ve just altered the logic in my find method, properly called the resetRadioOptions function, and altered my scoreHistory and now the first three tests are passing. The only test I’m not passing is the alert to the user if they have not selected an option

keepScoreBtn.addEventListener("click", () => {
  const scoreInputsArr = [...scoreInputs];
  const isChecked = scoreInputsArr.find(score => score.checked
  );
  
  const isCheckedValue = isChecked.value;
  const isCheckedId = isChecked.id;
  
  if (isChecked) {
    updateScore(isCheckedValue, isCheckedId);
    resetRadioOptions();
    scoreHistory.innerHTML = `<li>${isCheckedId} : ${isCheckedValue}</li>`
  } else {
    alert("Please select an option") 
  }
})

This is my updated code, I pass every test except the test about the alert. When I play the game and don’t select an option it just return undefined which I assume is correct because we’re not selecting anything, but I have no idea what the the condition for the if statement should be because the other tests regarding updating the score, reseting the radio options, and updating the score history is fine under that condition, but the alert doesn’t seem to work

never mind, i figured it out