Pobieranie danych z formularza

Formularze pozwalają użytkownikom wprowadzać dane do Twojej strony (np. w polach tekstowych, listach wyboru). W JavaScript możesz łatwo pobierać takie dane, aby je później wykorzystać czy wysłać na serwer. Poniżej znajdziesz prosty przykład, w którym odczytujemy dane z pól formularza i wyświetlamy je na stronie.

Struktura formularza

Najczęściej używa się pól tekstowych, selektorów, przycisków:

• name="imie", name="wiek" - atrybut name pozwala identyfikować dane pola.
• type="submit" - przycisk, który domyślnie wysyła formularz.

<form id="mojForm">
  <label>Imię: <input type="text" name="imie" /></label><br>
  <label>Wiek: <input type="number" name="wiek" /></label><br>
  <button type="submit">Wyślij</button>
</form>

See the Pen Untitled by EE-Informatyk.pl (@eeinformatyk) on CodePen.

Podsumowanie

• event.preventDefault() blokuje domyślne zachowanie wysyłania formularza (przeładowanie strony).
• form.elements.nazwa.value to prosty sposób pobierania danych z pól input (atrybut name="nazwa").
• Formularze są kluczowym elementem interakcji z użytkownikiem. Dzięki JavaScript możesz dane walidować, przetwarzać i wysyłać asynchronicznie do serwera (np. fetch, AJAX).