Formularze HTML

Szkielet formularza

Zasada: egzamin zawsze wymaga method="post". Nigdy nie uzywaj method="get".


Wszystkie typy pol — tabela szybkiego dostepu

Co chcesz uzyc Kod HTML
Pole tekstowe <input type="text" name="...">
Pole liczbowe <input type="number" name="...">
Pole email <input type="email" name="...">
Checkbox <input type="checkbox" name="...">
Radio <input type="radio" name="...">
Lista rozwijana <select name="...">
Pole wieloliniowe <textarea name="..." rows="10" cols="40">
Przycisk wysylajacy <button type="submit">
Przycisk czyszczacy <button type="reset">
Przycisk dla JS <button type="button" onclick="...">

Kazde pole z etykieta (label) — obowiazek na egzaminie

Zasada: for w <label> = id pola. Kliknięcie etykiety uaktywnia pole.

UWAGA na nazwy: - name — po tym PHP odbiera dane: $_POST['data'] - id — po tym JS szuka elementu: getElementById('data') - Obydwa sa potrzebne — nie pomijaj zadnego.


Checkbox i radio

Radio musi miec ta sama name — wtedy mozna wybrac tylko jeden.


Lista rozwijana (select)

value w <option> to to, co dostanie PHP. Tekst wewnatrz to to, co widzi uzytkownik.


Textarea

rows = liczba wierszy widocznych, cols = szerokosc w znakach.
Nie uzywaj <input type="text"> zamiast <textarea> dla dluzszych tekstow — egzamin to rozroznia.


Przyciski — trzy rozne zastosowania


Formularz w tabeli (arkusz 2024 — firma IT)

Egzamin moze wymagac umieszenia formularza w tabeli:


Kompletny formularz (wzor z 2021 — restauracja)


Czeste bledy na egzaminie

Blad Poprawnie
method="get" method="post"
Brak for w <label> <label for="id_pola">
Brak name w polu PHP nie odbierze danych
<input type="text"> zamiast <textarea> <textarea rows="10" cols="40">
Dwa checkboxy z ta sama name bez value Dodaj value do kazdego
type="submit" zamiast type="button" dla JS type="button" onclick="..."