Interactive Rating Component

Community feedback

• 

  バレンタイン 😈•64,170

  @VCaramesPosted almost 2 years ago

  Hey there! 👋 Here is some feedback to further improve your code:

  • The form should only be wrapping ⚠️ the rating "buttons" and "submit" button.

  • This is <input type="submit" class="btn" value="SUBMIT" id="submitBtn"/> outdated. Instead use a button element.

  • This is not necessary. Your JS should NOT ❌ be doing the job of CSS. You can use the pseudo element :checked to indicate which "button" was selected. So

  
  const label = document.querySelectorAll(".rating")
  
  label.forEach(i => {
      i.addEventListener("click", function () {
          label.forEach(i => i.classList.remove("active"))
          this.classList.add("active")
        })
  })
  

  If you have any questions or need further clarification, you can always check out my submission and/or feel free to reach out to me.

  Happy Coding! 👾

  Marked as helpful

  1

  ---

  

  Clément Bartholomé•60

  @ClementBartholomePosted almost 2 years ago

  Thanks a lot for this feedback ! I'll look back into it 👍

  0