Design comparison
Solution retrospective
This is a nice little project to practice handling user interactions and updating the DOM. It is a simple project to implement the new technologies that I am learning in a single project. This is my first project with Sass, the truth is that I am proud of the process, I also use Sassdoc and Jsdoc for the documentation, for the JavaScript I use Babel and Webpack to package the modules in a single js file. It was difficult, it was the first time that I handled so many packages together, in addition to the complexity of the IT CSS architecture and the SUIT CSS methodology, I looked for this project because it was simple, in such a way that I could concentrate more on the new tools that I am learning. .
Community feedback
- @grace-snowPosted almost 2 years ago
Hello
It’s very important to get html right on challenges. This must be a form with radio inputs, not a list of buttons. This is essential I’m afraid.
But the good news is once that’s done the js part becomes tiny and simple.
This challenge really only needs a few lines of js. It’s almost all standard html form functionality and that’s what you should be practicing here.
A loader isn’t necessary and is actually breaking your solution at the end by making the thank you content disappear.
Don’t over-engineer these things.
If displaying the thank you on the same screen and generating the thank you markup with js like you are doing at the moment, you would need a holding element present on the original page with an aria live attribute on it so the thank you gets announced to screenreader users. I also think you’d need to programmatically move focus to the thank you panel and make it persist.
Golden rule - no unexpected changes of context for users.
Once this has the correct html (form with radios) all the js needs to do is
- listen for submit
- get the value from the input name
- use that in the thank you
- hide first panel, show second one
Marked as helpful0
Please log in to post a comment
Log in with GitHub
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