Interactive rating component with html, sass, & javascript
Design comparison
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
- @ApplePieGiraffePosted almost 2 years ago
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 abutton
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 helpful2@anggaanugrahPosted almost 2 years ago@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 - @rafdidactPosted almost 2 years ago
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 acatch
statement wrapping the code that should run if so.You can check my solution for reference. Hope it helps.
Marked as helpful1@anggaanugrahPosted almost 2 years ago@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 GitHubJoin 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