Code Lab is in development. New lessons and improvements are on the way. Progress can be deleted.
Loading…
Code Lab is in development. New lessons and improvements are on the way. Progress can be deleted.
Loading…
Code Lab is in development. New lessons and improvements are on the way. Progress can be deleted.
JAVASCRIPT DOM / CHAPTER 04 / Learn / LESSON 07
A form sends data on submit (button or Enter). The browser reloads by default — for lesson-style apps call event.preventDefault().
Listen for "submit" on <form>, not only click on the button.
Mini example:
const form = document.querySelector("#form"); const msg = document.querySelector("#msg"); form.addEventListener("submit", (event) => { event.preventDefault(); msg.textContent = "saved"; });
Common mistake: forgetting preventDefault; or listening for click instead of submit.
<form id="form"><input id="note" type="text" /><button type="submit">Save</button></form><p id="msg">…</p>preventDefault stops the reload.
Press Run — HTML loads in a sandbox iframe; Stop removes the iframe (also kills infinite loops).
›