Interactive Rating Component

Community feedback

• 

  Utku Kaan Arasan•50

  @UtkuKaanArasanPosted about 2 years ago

  Looks great, you commented your code and it's easy to understand. My only recommendation is in css you could have used variables so you can change the color theme easily in the future.

  1

  ---

  

  P

  Hector Ramirez•350

  @hectorlil48Posted about 2 years ago

  @UtkuKaanArasan Thank you, I'm still getting used to writing CSS but I will look into that.

  0
• 

  David•8,000

  @DavidMorgadePosted about 2 years ago

  Hello again Hector! seems that you uploaded a few projects at the same time

  I dig a bit in your JS logic and everything seems ok for me! choosing the onSubmit function instead of a 'click' listener is a more readable and better way to approach the solution!

  I would just add a bit more of functionality, showing the user a pop up or alert window if they submit when no rating was selected, you can do this easy in your eventListener adding an if check like this:

      if(checkedInput === null)  return alert('Please choose a rating before submitting!')
          const selectedRating = document.querySelector(".selection");
          selectedRating.textContent = "You selected " + checkedInput.getAttribute("value") + " out of 5"
          rateStart.classList.add("hidden");
          thankYou.classList.remove("hidden");
  

  This will check if the user selected any rating button it will keep going on the function, if not it will just return an alert and stop working!

  Hope my little advice helps you, let me know if you try and you see the results! good job on this challenge

  0

  ---

  

  P

  Hector Ramirez•350

  @hectorlil48Posted about 2 years ago

  @DavidMorgade Thanks for the tip. I'm new to JavaScript, so I was trying to do as you said and it kept breaking my code, but I figured it out.

  0