HTML тег <form>
Формы встречаются в интернете почти на каждом сайте. Например, когда Вы вводите логин и пароль на сайте, то данные заполняются через формы и отправляются на сервер. Также примером формы являются различные опросы. Синтаксис тега <form>:
<form action="URL" method="POST/GET">
<input type="" name="">
<input type="" name="">
...
</form>
Тег <form> имеет очень важный атрибут action, которому присваивается адрес (URL) скрипта, которому передается полученная информация для обработки. Мы не будем углубляться в подробности того, что происходит после отправки данных, поскольку эти вопросы уже решает не html, а методы GET и POST в PHP.
Пример 1. Использование формы с кнопками
|
<body>
<form action="">
Это будут кнопки:
<br/><input type="radio" name="answer" value="a1">Кнопка один
<br/><input type="radio" name="answer" value="a2">Кнопка два
<br/><input type="radio" name="answer" value="a3">Кнопка три
<br/>А это будет текстовое поле. Например сюда можно вводить
логин
<br/><input type="text" name="login" style="width:400px;" value="Значение по умолчанию"> <br/>А это будет большое текстовое поле. Например сюда можно ввести информацию о себе
<br/><input style="width:400px; height:150px" type="textarea" name="osebe" value="">
<br/>После всего перечисленного будет кнопка ОК
<br/><input type="submit" value="OK">
</form>
<br/>После нажатия кнопки ОК,
страница просто обновится, т.к. мы не прописали параметр action
</body>
|
Преобразуется на странице в следующее:
|
Это будут кнопки:
Кнопка один
Кнопка два
Кнопка три
А это будет текстовое поле. Например сюда можно вводить логин
А это будет большое текстовое поле. Например сюда можно ввести информацию о себе
После всего перечисленного будет кнопка ОК
После нажатия кнопки ОК, страница просто обновится, т.к. мы не прописали параметр action
|
Пояснения к примеру
→ action="" - говорит о том, что обработка данных будет происходить на странице с формой.
→ - <input type="radio" name="answer" value=""> атрибут type="radio" говорит о том, что нужно отобразить текст после этого кода, как кнопку выбора. Атрибут name и value в данном теге для нас сейчас играют маленькую роль, т.к. мы не изучаем сейчас php (см. уроки php).
→ <input type="text" name="poletext" value=""> - атрибут type="text" говорит о том, что это будет текстовое поле. Здесь так же есть два важных атрибута: name (для php) и value (значение по умолчанию).
→ <input type="textarea" name="opisanie" value=""> - атрибут type="textarea" говорит о том, что это будет большое текстовое поле. Разница от предыдущего случая лишь в том, что он позволяет записывать большой объем текста.
→ <input type="submit" value=""> - атрибут type="submit" говорит о том, что это кнопка. В атрибуте value пишется то, что будет написано на кнопке.
Теперь рассмотрим подробно все атрибуты тега <form>.
Атрибуты form
1) Атрибут accept-charset="Кодировка" - определяет кодировку, в которой сервер может принимать и обрабатывать данные формы. Может принимать различные значения, например, CP1251, UTF-8 и т.п.
2) Атрибут action="URL" - адрес скрипта, который обрабатывает передаваемые данные от формы. Если оставить это значение пустым, то данные будут обрабатываться в этом же документе, где расположена форма.
3) Атрибут autocomplete="on/off" - задает или отключает автозаполнение формы. Может принимать два значения:
→ on - включить автозаполнение
→ off - выключить автозаполнение
4) Атрибут enctype="параметр" - задает способ кодирования данных. Может принимать следующие значения:
→ application/x-www-form-urlencoded - вместо пробелов ставится +, символы вроде русских букв кодируются их шестнадцатеричными значениями,
→ multipart/form-data - данные не кодируются,
→ text/plain - пробелы заменяются знаком +, буквы и другие символы не кодируются.
5) Атрибут method="POST/GET" - задает метод отправки. Может принимать два значения:
→ GET - передача данных в адресной строке (есть ограничение по объёму отправки данных),
→ POST - посылает на сервер данные в запросе браузера (может отправить большое количество данных, т.к. нету ограничения объёма).
Более подробное описание методов передачи через GET и POST читайте в уроках по PHP: использование методов GET и POST.
6) Атрибут name="имя" - задает имя формы. Чаще всего используется в случае наличия множества форм для того, чтобы можно было обратиться к конкретной форме через скрипт.
7) Атрибут novalidate - отменяет встроенную проверку данных формы на корректность ввода.
8) Атрибут target="параметр" - имя окна или фрейма, куда обработчик будет загружать возвращаемый результат. Может принимать следующие значения:
→ _blank - загружает страницу в новое окно браузера
→ _self - загружает страницу в текущее окно
→ _parent - загружает страницу во фрейм-родитель
→ _top - отменяет все фреймы и загружает страницу в полном окне браузера
Уважаемый читатель, теперь Вы узнали гораздо больше о html теге form. Теперь советую перейти к следующему уроку.
Ссылка на следующий урок: Урок 9. HTML тег div - подробное описание с примерами
← Перейти в каталог html уроков и советов
|
