Interactive Ratign Componenet - SCSS, Mobile first.

Community feedback

• 

  P

  Habeeb Kareem•740

  @olaide-hok

  Posted 4 months ago

  Great work here!

  Some feedbacks:

  1. Redundant Event Listener: The body click event listener is added every time the form is submitted, which can lead to multiple listeners being attached unnecessarily. This should be added only once, outside the submit event listener.

  const body = document.querySelector('body');
  body.addEventListener('click', function(event) {
      if (event.target.id === 'main' || event.target.id === 'successMessage') {
          successMessage.classList.remove('active');
          form.classList.add('active');
      }
  });
  
  

  2. Default Value Logic: The default value of ratingValue is set to 5, but this assumes that the user will always select a rating. If no rating is selected, the code should handle this case explicitly.

  let ratingValue = null; // Default to null or undefined
  ratingOptions.forEach(option => {
      if (option.checked) {
          ratingValue = option.value;
          console.log("This is the rating selected: " + ratingValue);
      }
  });
  
  if (ratingValue === null) {
      alert("Please select a rating before submitting.");
      return; // Exit the function early
  }
  
  

  00