requestFormReset with your own onSubmit
Validation runs first in our own handler. The reset is requested at the start of the Action but happens when it finishes, so the text stays visible while sending.
Pass a function to <form action={fn}> (or formAction={fn} on a button) and React calls it with the form's FormData as an Action: no preventDefault, a pending state through the form hooks, and uncontrolled fields reset automatically when it succeeds; requestFormReset resets a form on demand.
Change the code and press Run (Ctrl+Enter). Predict what will happen first, then break it on purpose and read what changes. Your edits are saved and match the lesson page.
Ready for more? This phase has 5 hands-on exercises with automatic checks.
Practice questions
Write the code in the editor, run it, then open the model answer to compare.
Build a newsletter form with an email field (type="email", required) whose action waits 300 ms and shows Subscribed: <email>.
Add an Approve and a Reject button to a form; both submit the same comment field but call different functions.
Explain it without notes
What happens when a form with action={fn} is submitted?
When does React reset a form after an action, and which fields are affected?
What is formAction for, and how does an action know which button was pressed?
When do you need requestFormReset?
Preview
Console
Nothing logged yet.Expected console output
empty, not sent
while sending, box: [Hello]
after, box: [] list: Hello