Основы html 5. Формы.
Небольшая статья, продолжающая рассказ о html. На этот раз, поговорим о формах.
Для взаимодействия пользователя и веб-приложения, существует не так уж и много средств. Одно из них – html-формы. Формы позволяют очень плотно взаимодействовать с пользователем, получать от него данные, которые можно направить серверной программе, либо использовать тут же, в браузере клиента.
О том, что же такое форма и как с ней работать, я и хочу поговорить в этой статье.
Начнем с того, что форма состоит из элементов, которые являются стандартными и, не смотря на различия во внешнем виде, во всех браузерах выполняют одинаковую функцию. Перечислим все элементы форм, которые нам могут потребоваться:
Определение формы |
<form></form> |
Строка ввода |
<input type= «text» /> |
Строка ввода пароля |
Type = «password» |
Строка для ввода имени загружаемого файла |
Type = «file» |
Кнопка |
Type = «button» |
Флажок |
Type = «checkbox» |
Переключатель |
Type = «radio» |
Кнопка отправки данных формы на сервер |
Type = «submit» |
Кнопка сброса данных формы |
Type = «reset» |
Область ввода текста |
<textarea></textarea> |
Выпадающий список |
<select></select> |
Элемент выпадающего списка |
<option></option> |
Группа элементов |
<fieldset></fieldset> |
Подпись к группе элементов |
<legend></legend> |
Начнем по порядку.
Тег <form></form>
Это тег призван обозначить форму в документе и отделить одну форму от другой. Например, кнопка Submit отправляет данные той формы, в которой находится. Тег form имеет несколько важных атрибутов, на которых стоит остановиться подробнее. Рассмотрим пример:
<form action='serverScript.pl' method='post' enctype='multipart/form-data' >
Атрибут acton указывает какой серверной программе следует передать данные формы, после отправки. Атрибут может содержать сложное значение, описывающее абсолютный или относительный путь до скрипта, относительно данной страницы.
Атрибут method определяет метод, которым будут передаваться данные. По-умолчанию принят метод GET, а в данном случае, мы определяем метод POST.
Enctype определяет метод кодирования, которому подвергнутся данные, перед отправкой на сервер. В данном случае, мы определили метод кодирования multipart/form-data. Этот метод всегда нужно применять, когда мы хотим передавать файлы через форму. Для передачи простого текста, можно этот атрибут не указывать.
- С чего начать изучение html?
- Основы html. Общие правила. Блочные и строчные элементы.
- Основы html 2. Абзацы, списки, заголовки.
- Основы html 3. Таблицы.
- Основы html 4. Ссылки.
- Основы html 5. Формы.
- Основы html 6. Формы (продолжение).
- Основы html 7. textarea.
Если вам понравился данный мини-курс, или он вызвал вопросы или пожелания, если вы хотите поспорить о чем-то - я был бы рад вашему отзыву в комментариях или по почте.
![[Valid RSS]](/img/valid-rss-rogers.png)
by SHAman