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 with html, sass, & javascript

#sass/scss

@anggaanugrah

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


Hello guys, here is my solution for the Interactive Rating Component Challenge. Let me know if you like it or have better ideas for me to write much better & efficient code. Please help me to improve my skills by giving your feedback. Thanks ๐Ÿ™

Community feedback

P
ApplePieGiraffeโ€ข 30,545

@ApplePieGiraffe

Posted

Hey there, Angga Anugrah Pratama! ๐Ÿ‘‹

Well done on this challenge! ๐Ÿ‘ The card component looks good and works well! ๐Ÿ™Œ

I'd like to suggest wrapping the radio buttons and the submit button in a form element. You should also use a button element for the submit button (since it is a button, not a link). This way, the button will automatically submit the form when it is clicked, and your HTML will be more semantic. ๐Ÿ˜‰

Keep coding (and happy coding, too)! ๐Ÿ˜

Marked as helpful

2

@anggaanugrah

Posted

@ApplePieGiraffe thanks for the feedback you gave ๐Ÿ™Œ, your advice helped me a lot. I will try to improve my code and implement your suggestions in mine. Thank you very much ๐Ÿ˜„๐Ÿ™

1

@rafdidact

Posted

Hey, Angga!

I like your JavaScript, maybe even more than mine. It's very clean, but there's a common user error you have to catch.

If the user doesn't select any rating and then clicks submit, the form is submitted and the thank you message is presented without a rating. This should not happen.

In my code, this throws an error to the console. I catch it with a try statement wrapping the code that might break and a catch statement wrapping the code that should run if so.

You can check my solution for reference. Hope it helps.

Marked as helpful

1

@anggaanugrah

Posted

@rafdidact Hello Adรกn ๐Ÿ˜„. You're right, I didn't notice about the unselected ratings you said. thank you for the advice you gave. i will try to fix my code. This is really helpful for me ๐Ÿ™

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