Главная
Случайная страница
Полезное:
Как сделать разговор полезным и приятным
Как сделать объемную звезду своими руками
Как сделать то, что делать не хочется?
Как сделать погремушку
Как сделать так чтобы женщины сами знакомились с вами
Как сделать идею коммерческой
Как сделать хорошую растяжку ног?
Как сделать наш разум здоровым?
Как сделать, чтобы люди обманывали меньше
Вопрос 4. Как сделать так, чтобы вас уважали и ценили?
Как сделать лучше себе и другим людям
Как сделать свидание интересным?
Категории:
АрхитектураАстрономияБиологияГеографияГеологияИнформатикаИскусствоИсторияКулинарияКультураМаркетингМатематикаМедицинаМенеджментОхрана трудаПравоПроизводствоПсихологияРелигияСоциологияСпортТехникаФизикаФилософияХимияЭкологияЭкономикаЭлектроника
|
Отправка данных на сервер
Для того чтобы успешно подготовить введенные посетителем данные и отправить их серверному приложению, Web-форма должна "знать" метод отправки данных, указывающий вид, в котором данные будут отправлены. Таких методов HTML поддерживает два:
- Метод GET формирует из введенных посетителем данных набор пар вида <имя элемента управления>=<введенные в него данные>.
Эти пары добавляются справа к интернет-адресу серверного приложения, отделяясь от него символом?(вопросительный знак); сами пары разделяются символами & (амперсанд). Полученный таким образом интернет-адрес отправляется Web-серверу, который извлекает из него интернет-адрес серверного приложения и сами данные.
- Метод POST также формирует из введенных данных пары вида <имя элемента управления>=<введенные в него данные>. Но отправляет он их не в составе интернет-адреса, а вслед за ним, в качестве дополнительных данных.
Ввиду того, что курс посвящен основам клиентской разработки, мы не будем останавливаться на вопросах обработки информации сервером.
<form>
Тег < form > определяет форму HTML страницы.
Когда форма отправляется на сервер, управление данными передается программе, заданной атрибутом action тега< form >. Предварительно браузер подготавливает информацию в виде пары "имя=значение", где имя определяется атрибутом name тега < input >, а значение введено пользователем или установлено в поле формы по умолчанию.
Внутрь контейнера < form > помещаются другие теги, при этом сама форма никак не отображается на веб-странице, видны только ее элементы и результаты вложенных тегов.
Оформляется тег следующим образом:
<form>
.........
</form>
К атрибутам < form > относятся:
- accept - charset – определяет кодировку, в которой сервер может принимать и обрабатывать данные;
- action - определяет адрес программы или документа, который обрабатывает данные формы;
- autocomplete – включает автозаполнение полей формы;
- enctype – определяет способ кодирования данных формы. Может принимать следующие значения:
- application/x-www- form -urlencoded – вместо пробелов ставится +, символы вроде русских букв кодируются их шестнадцатеричными значениями;
- multipart/ form -data – данные не кодируются;
- text/plain – пробелы заменяются знаком +, буквы и другие символы не кодируются.
- method – метод протокола HTTP (GET или POST);
- name – определяет имя формы;
- novalidate – отменяет встроенную проверку данных формы на корректность ввода;
- target –задает имя окна или фрейма, куда обработчик будет загружать возвращаемый результат.
<input>
Как уже упоминалось, элемент < form > является своего рода контейнером для других элементов управления.
Чаще всего для определения элементов управления используется тег < input >.
< input > предназначен для создания текстовых полей, различных кнопок, переключателей и флажков. Хотя элемент < input > не требуется помещать внутрь контейнера < form >, определяющего форму, но если введенные пользователем данные должны быть отправлены на сервер, где их обрабатывает серверная программа, то указывать < form > обязательно. То же самое обстоит и в случае обработки данных с помощью клиентских приложений, например, скриптов на языке JavaScript.
Атрибуты тега < input >:
- accept – устанавливает фильтр на типы файлов, которые вы можете отправить через поле загрузки файлов;
- accesskey – задает комбинацию клавиш, позволяющую перейти к элементу;
- align –определяет выравнивание изображения;
- alt – альтернативный текст для кнопки с изображением;
- autocomplete –включает или отключает автозаполнение, соответственно принимает значения on и off;
- border – задает толщину рамки вокруг изображения.;
- checked – предварительно активированный переключатель или флажок;
- disabled – блокирует доступ и изменение элемента;
- form – связывает поле с формой по её идентификатору;
- formaction – определяет адрес обработчика формы;
- formenctype – устанавливает способ кодирования данных формы при их отправке на сервер;
- formmethod – сообщает браузеру каким методом следует передавать данные формы на сервер (GET или POST);
- formnovalidate – отменяет встроенную проверку данных на корректность введенных значений;
- formtarget – определяет окно или фрейм в которое будет загружаться результат, возвращаемый обработчиком формы;
- list – указывает на список вариантов, которые можно выбирать при вводе текста;
- max– максимально допустимое значение для ввода числа или даты;
- maxlength –максимально допустимое количество символов разрешенных в тексте;
- min - минимально допустимое значение для ввода числа или даты;
- multiple –позволяет загрузить несколько файлов одновременно;
- name – задает имя поля, предназначено для того, чтобы обработчик формы мог его идентифицировать;
- pattern – устанавливает шаблон ввода;
- placeholder –выводит подсказывающий текст;
- readonly –устанавливает, что поле не может изменяться пользователем;
- required – отмечает, что поле является обязательным для заполнения;
- size –задает ширину текстового поля;
- src – определяет адрес графического файла для поля с изображением;
- step – задает шаг приращения для числовых полей;
- tabindex – определяет порядок перехода между элементами с помощью клавиши Tab;
- type – сообщает браузеру, к какому типу относится элемент формы.
- value –определяет значение элемента.
Основной атрибут тега < input >, определяющий вид элемента — type. В таблице 17.1 перечислены значения, которые может принимать этот атрибут.
Таблица 17.1.
| Значение атрибутаtype
| Описание
| button
| Кнопка
| checkbox
| Флажки. Позволяют выбрать более одного варианта из предложенных.
| file
| Поле для ввода имени файла, который пересылается на сервер.
| hidden
| Скрытое поле. Оно никак не отображается на веб-странице.
| image
| Поле с изображением. При нажатии на рисунок данные формы отправляются на сервер.
| password
| Обычное текстовое поле, но отличается от него тем, что все символы показываются звездочками.
| radio
| Переключатели. Используются, когда следует выбрать один вариант из нескольких предложенных.
| reset
| Кнопка для возвращения данных формы в первоначальное значение.
| submit
| Кнопка для отправки данных формы на сервер.
| text
| Текстовое поле. Предназначено для ввода символов с помощью клавиатуры.
| color
| Виджет для выбора цвета.
| date
| Поле для выбора календарной даты.
| datetime
| Указание даты и времени.
| datetime -local
| Указание местной даты и времени.
| email
| Для адресов электронной почты.
| number
| Поле ввода чисел. Ввод символов, не являющихся цифрами приведет к выводу предупреждения.
| range
| Ползунок для выбора чисел в указанном диапазоне.
| search
| Поле для поиска.
| tel
| Поле для телефонных номеров.
| time
| Поле для времени.
| url
| Поле для веб-адресов.
| month
| Поле для выбора месяца.
| week
| Поле для выбора недели.
|
Date: 2015-07-22; view: 513; Нарушение авторских прав Понравилась страница? Лайкни для друзей: |
|
|