Последним шагом в создании формы является добавление кнопки для отправки результата на сервер. Для этого, используя парный тег <button>, создадим кнопку отправки:

<form>
  <button>Отправить</button>
</form>

После нажатия на кнопку «Отправить», данные будут переданы обработчику, который указан в атрибуте action (если не указан, то данные отправятся на эту же страницу). После отправки данных страница будет перезагружена.

Теперь, используя элементы форм из прошлых уроков, создадим форму с разными полями.

<h2>Search form</h2>
<form>
  <label>
    Enter your query
    <input type="search">
  </label>
  <select>
    <option disabled>Choose section to search in</option>
    <option>JS</option>
    <option>HTML</option>
    <option>CSS</option>
  </select>
  <button>Search</button>
</form>

Если вы нажмёте на кнопку Search, то страница перезагрузится и данные должны будут уйти в обработчик на эту же страницу. Так как обработчика нет, то никаких видимых результатов, кроме перезагрузки страницы, не произойдёт.

Создайте форму, у которой файл с обработчиком данных лежит по адресу /people. Внутри формы расположите следующие элементы:

• 2 текстовых поля <input>
• Список с возможностью множественного выбора
• Кнопку «Отправить»