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

Interactive rating component

Lucian 10

@lucianbeck

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 would like to add an alert to be shown instead of the "thank you" div, when the Submit button is clicked without selecting any rate number. I tried to do it adding "if" conditions to the click event listener, but wasn't able to make it work so I would really appreciate some assistance with that

Community feedback

@RajSanjel

Posted

One thing you can do is make it normal button and add Event listener for click in button. When the submit button is clicked you can look for the rating button which is clicked and get its inner text and if nothing is clicked you can handel it by using if statement. Hope this helped. If you have any confusion you are free to ask.

0

Lucian 10

@lucianbeck

Posted

@RajSanjel Thanks a lot Raj! I actually managed to get it done by using if conditions. I really appreciate your feedback

0

@RajSanjel

Posted

@lucianbeck Its my pleasure to help you. It looks good but still there is one issue and that is if user presses somewhere else then it removes the color. Its would be better to use class so that the color doesn't fade out when user clicks somewhere else since user gets confused and its not a good user experience. Also the attribution section is creating problem in mobile. You might wanna fix it. And if this helped you can mark it as helpful 😁 but its your choice to mark or not.

Marked as helpful

0
Lucian 10

@lucianbeck

Posted

@RajSanjel Done. I think I've solved every issue now. Thanks for your help!

0

@RajSanjel

Posted

@lucianbeck You are welcome.

0
Yokke 640

@Jexinte

Posted

Hello , I let you know what the e.prevendefault() method is !

0

Lucian 10

@lucianbeck

Posted

@Jexinte Thanks a lot! I actually managed to get it done by using if conditions, but I'll surely read more about the e.prevendefault() method. I greatly appreciate the feedback!

0
Yokke 640

@Jexinte

Posted

@lucianbeck You're welcome keep it up

1

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