js

Community feedback

• 

  Prabhash Ranjan•2,540

  @besttlookkPosted over 2 years ago

  hi, I went through your code, it was messy. I also went on and wrote js code for you which i will share at last but first let me give you some advice:

  1. It is best you use external JS. You wrote js both internally and externally. Go with external JS.
  2. Give class name that nakes sense.
  3. For button default role is button. You dont have to define it.

  Now here is the solution to select rating.

  <div class="buttons">
    <button class="rating-btn" data-rate="1" >1</button>
    <button class="rating-btn" data-rate="2" >2</button>
    <button class="rating-btn" data-rate="3">3</button>
    <button class="rating-btn" data-rate="4" >4</button>
    <button class="rating-btn" data-rate="5">5</button>
  </div>
  <button  id="submitBtn">SUBMIT</button>
         
  

  const rateBtns = document.querySelectorAll(".rating-btn");
  const submitBtn = document.querySelector("#submitBtn")
  
  let ratingSeletced;
  rateBtns.forEach(btn => {
    btn.addEventListener('click', handleRateBtnClick)
  })
  
  function handleRateBtnClick(e){
    ratingSeletced = e.target.dataset.rate
  }
  
  
  submitBtn.addEventListener("click" , () => {
    if(ratingSeletced){
      console.log(ratingSeletced)
    // Now you have selected rating go to thank you page      
    }else{
      console.log("No rating selcted")
    // Do not let user get forward
      return;
    }
  })
  

  Good luck #happyCoding

  Marked as helpful

  0
• 

  Ciceron•940

  @MarcusTuliusCiceronPosted over 2 years ago

  Hey congrats on submitting this challenge,

  From what I see you are trying to go for a very complex solution, not sure if it is really a good approach for a first try. What I could suggest is: in html: -use only class for your rating btns in css: -create a class for the selected btn style in JS: -create a funtion that toggle the selected class on an element.

  add event listener on all buttons on click that will call your function that toggle the selected class.

  This will be a first step on your code I think

  Hope this will help you to sort out your issues

  0