Resul Elezi• 90
@resul-elezi
Posted
Nice job! keep up the good work
1
What are you most proud of, and what would you do differently next time?
It took me some time to figure out how to work with vanilla js. It was fun doing it.
@resul-elezi
Posted
Nice job! keep up the good work
@0xabdulkhaliq
Posted
Hello there 👋. Congratulations on successfully completing the challenge! 🎉
MAKING RATING FORM ACCESSIBLE :
button
elements which are paired up with Javascript to handle the operation.<div class="btns">
<button class="rating-button" value="1">1</button>
<button class="rating-button" value="2">2</button>
...
</div>
<button type="submit" id="submit-btn">Submit</button>
input
element with type="radio"
which is wrapped inside fieldset
and form
. By using radio buttons instead of normal button
we can simply give checkboxes like options to select instead of relying on Javascript to work.<form>
<fieldset>
<legend class="sr-only">Please select a rating</legend>
<div>
<input type="radio" name="rating" id="rating-1" value="1">
<label for="rating-1">1</label>
</div>
<div>
<input type="radio" name="rating" id="rating-2" value="2">
<label for="rating-2">2</label>
</div>
....
</fieldset>
<button type="submit">
Submit
</button>
</form>
my submission
for this challenge, So that you could figure out how built this rating component in an inclusive way to prevent accessibility issues..
I hope you find this helpful 😄 Above all, the solution you submitted is great !
Happy coding!
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