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 component

@AliMohamed35

Desktop design screenshot for the Interactive rating component coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

T
Grace 29,670

@grace-snow

Posted

I'm afraid this all needs rewriting. This challenge is designed to teach essential foundations in how to work with forms. This must be a form with a fieldset of radio inputs. You'll need to learn how to custom style the radios and keep them accessible. There is no need for any click listeners anywhere, just a single submit listener. It only needs a very few lines of JS.

You can get the selected radio value from the form data inside the submit event. It will be something like ${form.rating.value} (if the radios have name="rating"). MDN docs are very good for going through how to use different form and input elements and their data from submit.

Try and get the html right first. Then CSS. Then JS.

Good luck.

Marked as helpful

0

@AliMohamed35

Posted

@grace-snow

Wow, didn't realize that actually thought that doing it that way is going to be easier and give us the desired goal. but, thank you for you comment, I'll re-do it again and read more about what you told me

Thank you again,

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