Interactive rating component

Community feedback

• 

  Mohanad Alrwaihy•340

  @MohanadOOPosted over 2 years ago

  Great Work, I liked how you did the flip animation when pressing the submit button.

  I would suggest one more thing that I did is to disable the button when there is no button is selected.

  To do that you have first to change <button></button> to be an <input type="button" value="Submit"/> and probably you have to add text-align: center to center the text.

  After that in your script you can disable the button onload by adding:

  const submitbtn = document.querySelector('.submit') 
  window.onload = () => {
      submitbtn.disabled = true
  }
  

  You can style the button when it is disabled in the CSS like this:

  .submit:disabled {
      background-color: hsl(25, 97%, 53%, 40%);
      pointer-evnets: none;
  }
  

  And finally, when the user clicks on any of the review buttons it should remove the disabled attribute from the submit button it can be done by making it false submitBtn.disabled = false

  I hope this adds something useful for you! 😀👍

  Marked as helpful

  0

  ---

  

  Khadija Gwarzo•120

  @naura1835Posted over 2 years ago

  @MohanadOO Yes it does. Thank you very much, it makes so much sense to disable the button when a user hasn't selected anything otherwise it will still display the thank you part. Thanks for pointing it out, I'll work on it.

  1