Last updated: August 27, 2026.
Use FormData to read form controls and textContent to display input as text.
<form id="profile-form">
<label>Name <input name="name" required></label>
<label>Email <input name="email" type="email" required></label>
<button>Preview</button>
</form>
<pre id="preview" aria-live="polite"></pre>const form = document.querySelector("#profile-form");
const preview = document.querySelector("#preview");
form.addEventListener("submit", (event) => {
event.preventDefault();
const data = new FormData(form);
preview.textContent = `Name: ${data.get("name")}\nEmail: ${data.get("email")}`;
});The server must independently validate and safely encode submitted values.
