фильтрацию контента (с помощью выпадающих списков, флажков и др.);
выполнение поиска;
загрузку файлов.
Чтобы приспособиться к этим потребностям, HTML предлагает интерактивные элементы управления
формы:
текстовые поля (для одной или нескольких строк);
переключатели;
флажки;
выпадающие списки;
виджеты для загрузки;
кнопки отправки.
Эти элементы управления задействуют разные теги
HTML, но большинство из них использует тег
. Поскольку это самозакрывающий элемент, тип поля определяется его атрибутом type
:
Элемент
Перед отправкой данных браузер подготавливает информацию в виде пары «имя=значение», где имя определяется атрибутом name тега
или другим тегом допустимым в форме, а значение введено пользователем или установлено в поле формы по умолчанию. После нажатия пользователем кнопки Submit, происходит вызов обработчика формы, который получает введенную в форме информацию, а дальше делает с ней то, что предполагает разработчик. В качестве обработчика формы обычно выступает программа, заданная атрибутом action тега
. Программа может быть написана на любом серверном языке вроде PHP, Python, C# и др.
Часто бывает, что текущая страница написанная, допустим, на PHP, сама является обработчиком формы, в таком случае можно указать пустое значение атрибута action
или вообще его опустить. В простейшем случае тег
не содержит никаких атрибутов и представлен в примере 2.
В качестве значения атрибута action
можно указать также адрес электронной почты, начиная его с ключевого слова mailto:
. При отправке формы будет запущена почтовая программа, установленная по умолчанию. В целях безопасности в браузере задано, что отправить незаметно информацию, введенную в форме, по почте невозможно. Для корректной интерпретации данных используйте атрибут enctype
со значением text/plain
в теге
(пример 3).
Пример 3. Отправка формы по почте
HTML5
IE
Cr
Op
Sa
Fx
Формы
Браузеры неоднозначно работают с таким кодом. Firefox предложит список подходящих приложений для отправки почты (рис. 1), Internet Explorer выведет предупреждение (рис. 2) и попытается запустить программу, сопоставленную с почтой, Opera подобно Firefox предложит список вариантов подходящих для отправки почты (рис. 3).
Рис. 1. Запуск приложения в Firefox
Рис. 2. Предупреждение Internet Explorer
Рис. 3. Выбор программы в Opera
2018-06-28
Создаем формы HTML
Здравствуйте уважаемый посетитель!
В предыдущих разделах мы создали основные элементы сайта, а также рассмотрели вопросы, связанные с наполнением контента. И теперь можем перейти к следующей довольно важной и обширной теме - к работе с формами HTML.
HTML-формы важнейшие элементы взаимодействия, определяющие интерактивную часть веб-страницы. Без которых не может обойтись ни один полноценный сайт. Ведь именно с их помощью осуществляется основной обмен между пользователем и стороной сервера.
Но в то же время, формы являются довольно сложными элементами интерфейса, с большим разнообразием функциональных компонентов и текстовых полей. Поэтому, в данном разделе постараемся более подробно рассмотреть основные ее элементы, уделив особое внимание практическому их применению в создаваемом сайте.
Причем здесь также будут затронуты и вопросы работы с базой данных MySQL. Так как применение форм в наших примерах будет неразрывно связано с их взаимодействием с таблицами БД. В которых будут сохраняться введённые пользователями данные, используемые в дальнейшем сервером при обработке запросов.