JavaScript: Formularze - Odczytywanie danych · Kurs: JavaScript · Technik informatyk egzamin zawodowy

W tej części pokażemy, jak odczytywać wartości pól formularza w JavaScript. Skupimy się na prostych, praktycznych przykładach. Dla początkujących najważniejsze reguły to: nasłuchuj na zdarzenie submit formularza i używaj atrybutów name na polach (to klucz do ich identyfikacji).

1. Najprościej: pobranie wartości pojedynczego pola

Każde pole formularza ma właściwość value (a np. checkbox dodatkowo checked).

<form id="profile">
  <input id="firstName" name="firstName" placeholder="Imię">
  <button type="button" id="readBtn">Pobierz</button>
</form>

const input = document.getElementById("firstName");
document.getElementById("readBtn").addEventListener("click", () => {
  console.log("Imię:", input.value); //…