Формы. Базовая информация

Форма на сайте позволяет передать данные от клиента сервер. Обычно, данные сохраняют в базе данных. Также можно отправить на электронный адрес.

Для создания формы используют тег form, внутри которого размещаются отдельные элементы формы - текстовые поля, кнопки, флажки и переключатели.

Важные атрибуты формы.

  • action — адрес страницы, на которую нужно отправить данные формы;
  • method — метод отправки данных формы (POST или GET);
  • enctype — способ кодирования данных формы.

Создадим простую форму с тремя полями без излишней красоты и форматирования: имя, адрес, сообщение и кнопка отправки данных формы.





<form>
	<label for="name">Имя:</label>
	<input type="text" name="name">
    <br>
	<label for="email">Email:</label>
	<input type="email" name="email">
    <br>
	<label for="text">Сообщение:</label>
	<textarea name="text"></textarea>
    <br>
	<button type="submit">Отправить</button>
</form>

Мы использовали form без атрибутов. Если их не указать, тогда форма будет работать по умолчанию. Но обычно так никогда не делают.

Атрибут action позволяет указать адрес страницы, на которую будет отправлены данные формы. Соответственно, эта страница примет эти данные и обработает их. Как правило, для обработки используют серверный язык, например, PHP. Если атрибут action не указан, тогда данные будут отправлены на текущую страницу.

Атрибут method позволяет указать способ передачи данных. По умолчанию используется метод GET, который передает данные через адресную строку (т.н. GET-параметры). Также мы можем указать в качестве метода передачи данных — POST, который передает данные в запросе браузера и они не видны пользователю. Чаще всего для формы используют именно метод POST.

Для полей мы использовали атрибут name, который позволяет присвоить имя полю. Имя должно быть уникальным для каждого из полей. Имя необходимо для того, чтобы на сервере понимать, из какого поля какие данные пришли.

О том, как обрабатывать данные из формы можно найти в других статьях. Например, PHP: Знакомство с формами.

Реклама