Тег <form>: сбор и отправка данных
Как связать поля, выбрать метод отправки и отделить интерфейс от обработки данных.
Зачем нужен этот элемент
form объединяет элементы ввода для отправки на сервер. Сама разметка не сохраняет заявки и не отправляет письма: по указанному адресу должен работать обработчик. У каждого отправляемого поля нужен name, иначе его значение не попадёт в обычную отправку.
Для обработчика, написанного на PHP, понадобится хостинг с поддержкой PHP и подходящей версией интерпретатора. Это один из вариантов серверной реализации; если страница остаётся статической, одного тега form для обработки заявок недостаточно.
Метод GET подходит для поиска и фильтров, когда параметры полезно видеть в адресе. POST применяют для операций с данными. Ни один метод не заменяет HTTPS и серверную проверку. В учебной песочнице отправка форм специально заблокирована.
Синтаксис и пример
<form action="/search/" method="get">
<label for="query">Что найти?</label>
<input id="query" name="q" type="search" required>
<button type="submit">Найти</button>
</form>Что важно в разметке
| Параметр | Как использовать |
|---|---|
| action | Адрес серверного обработчика. |
| method | get или post. |
| enctype | Для файлов обычно multipart/form-data. |
| name полей | Ключи отправляемых значений. |
Частая ошибка
Небольшая практика
Добавьте подписи к полям и проверьте их связность. Настоящую отправку тестируйте только на своём обработчике, не на случайном внешнем адресе.
Разберите также <input>, <label>: эти элементы пригодятся в том же интерфейсе.