Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Mobile First Responsive rating-Component with Animation Basic js

@mossabboujnah

Desktop design screenshot for the Interactive rating component coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


I had some Problems with the eventhandling other than than it was straight forward

Community feedback

Josh 1,070

@josh76543210

Posted

Hello @mossabboujnah,

Great job on your solution!

I noticed that when you submit the rating without selecting a number first it will submit and show "You selected out of 5". To prevent this error from occurring I would suggest checking if a number has been inserted when submiting the rating.

Adding a simple if statement should do the trick:

function handleSubmit(){
  if(document.getElementById("yourRate").innerText){
    document.getElementById("main").style.display = "none";
    document.getElementById("feedback").style.display = "block";
    document.getElementById("feedback").classList.add("animation");
  }
}

Happy Coding!

Marked as helpful

0

@mossabboujnah

Posted

Thats true did not consider that , thank you for the feedback@josh76543210

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord