Submit & Reset.

Theory. submit is an event of the form (not of the button). By default the browser sends the form and reloads the page. event.preventDefault() stops that and you take control.

The typical success path: preventDefault → read the fields → show a success message → form.reset() to clear. form.reset() sets each field back to its initial value (empty for a text field) and fires a reset event.

IMPORTANT ORDER: read the values first, then reset(). After reset() the fields are empty and your success text would have no data.

Small example:

form.addEventListener("submit", (event) => { event.preventDefault(); const note = form.elements.note.value; msg.textContent = "Saved: " + note; form.reset(); });

Code Lab has no network: the submission is simulated locally.

Common mistake: reset before reading; forgotten preventDefault; a click listener instead of submit (Enter in the field skips the click).