AI Frontend · Exercise 5 of 5 Previous
Intermediate
Good Answer, Bad Answer
Under a finished answer there are two toggle buttons, #up ("Good answer") and #down ("Bad answer"). Clicking one sends POST /api/feedback with { "rating": "up" } or { "rating": "down" }.
Mark a button as saved only after the server answers with a success status: set aria-pressed="true" on it and "false" on the other. If the server fails, show Could not save your feedback. Tap again to retry. in #error and leave the buttons unmarked. A second click while a save is running must be ignored, and a later success clears #error.
What Check tests
- Both buttons start unmarked
- Two quick clicks on Good answer send one request, and the button ends up pressed
- When the server fails,
#errorshows the retry message and Bad answer is not marked - Tapping again works: Bad answer is pressed, Good answer is not, and the error is gone
- Both buttons have visible text
Stuck? One hint at a time
The solution unlocks after your first Check. Try first: that is where the learning happens.
Runs in your browser. Your code is saved here.
Your page
Press Run to see the page.
Console
Nothing logged yet.