Атрибуты form и input

form

Есть у меня не большая проблема с формами.  Не могу запомнить и постоянно путаю для чего нужны или просто пропускаю необходимые атрибуты. Чтобы не рыть каждый раз интернет составил список, содержащий необходимый минимум, который должен присутствовать в любой форме.

Атрибуты тега <form>

  • action — указывает на обработчик формы.
  • name — используется для обращения к форме из JS.
  • method — сообщает серверу о методе запроса get/post. Метод отправки данных по умолчанию get.

Обязательным из этих трёх является только action и вроде бы можно обойтись без name и method. На практике к формам подключают разные скрипты — валидаторы или подсказки, а отправлять пароли get-запросом такая себе идея. Поэтому юзаем все три атрибута.

Атрибуты тега <input>

Начнём с обязательных параметров

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

Наличие следующих атрибутов не критично, но применяются они довольно часто.

  • value — значение отправляемое на сервер. Можно использовать как значение по умолчанию.
  • placeholder — текст внутри поля формы. В отличии от value никуда не отправляется и исчезает при фокусе.
  • form — связывает элемент и форму если элемент расположен за пределами формы. Для этого у формы должен быть id.
  • Id — связывает label и input. Для этого у label должен быть атрибут for со значением как id у соответствующего input. Клик по такому label будет равнозначным клику по input.

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

UPD1 Метод get хорош например для форм фильтров в интернет магазине. Параметры передаются в URL то есть можно сохранить ссылку с значениями фильтров.