14 декабря 2020 
mob25
На этом шаге мы рассмотрим создание формы.
На прошлом шаге мы говорили о динамическом формировании Web-документов и теперь рассмотрим конкретный пример на эту тему.
Одна из популярных задач в Интернете, это получение каких-либо сведений от клиента, их обработка на сервере и отправка клиенту документа-ответа.
Задача эта решается в HTML-документах обычно при помощи формы. После заполнения формы, запрос отправляется на сервер при помощи
метода POST, стандартного метода протокола HTTP. Метод используется для отправки сообщений на электронные доски объявлений,
в группы новостей, для добавления информации в базу данных и вообще, в тех случаях, когда нужно получить от клиента данные и отправить их
для обработки на сервер. Если в форму вводятся данные для формирования на их основе запроса, то в этом случае используется метод GET.
Рассмотрим следующий пример. Допустим у нас на сервере организована телеконференция. И мы рассмотрим маленькую часть этого проекта:
как получать от клиента новые сообщения, чтобы затем публиковать их на сервере. Задача состоит из двух частей: клиенту нужно заполнить форму и
как-то послать данные на сервер; сервер должен получить эти данные и обработать. Первая половина задачи решается при помощи формы -
стандартного элемента языка HTML. Форма включает в себя текст, элементы разметки, элементы управления (кнопки, флажки, радио-кнопки, меню и др.)
и надписи к этим элементам управления. Поскольку у формы много возможностей, мы обсудим только те, что будем использовать в примере. Форма начинается с тега
<FORM> и заканчивается тегом </FORM>. В начальном теге могут задаваться несколько атрибутов. Обязательно указывается атрибут
ACTION, в котором задается URI получателя данных от формы. Обычно это имя сервера и имя приложения, которое должно обработать данные.
Атрибут METHOD задает имя используемого метода протокола HTTP. О методах мы поговорим позже, скажем только, что в формах
возможны только два значения - GET и POST. В случае метода GET данные формы используются для формирования запроса
серверному приложению, которое должно сформировать ответ на основе этого запроса, и вернуть его клиенту. В нашем случае используется метод POST,
предназначенный для публикации данных в Web. Вводятся данные с помощью тегов <INPUT>, <SELECT>, <TEXTAREA> и др.
Тег <INPUT> обслуживает ввод строки текста, пароля (вводимые символы пароля при этом скрываются и могут заменятся, например, на символ "звездочка")
и создание элементов управления флажок и радио-кнопка. Кнопки SUBMIT и RESET, используемые для отправки данных на сервер и очистки формы,
также, создаются с помощью этого тега. При нажатии на кнопку RESET, удаляется введенная пользователем информация, и в элементы управления подставляются
значения по умолчанию, определяемые атрибутом VALUE. Тип элемента указывается с помощью атрибута TYPE. Для перечисленных элементов
управления этот атрибут принимает значения TEXT, PASSWORD, CHECKBOX, RADIO, SUBMIT и RESET. Тег <SELECT>
применяется для задания меню. С помощью тега <TEXTAREA> можно ввести в форму текстовый блок. В обязательном порядке теги, задающие
элементы управления должны, содержать атрибут NAME, с помощью которого каждому элементу присваивается имя, которое будет отсылаться программе-обработчику
вместе со значением, полученным этим элементом управления, Из рассмотренных нами тегов в примере применяются <INPUT> и <TEXTAREA>.
У этих тегов еще имеются размерные атрибуты SIZE, COLS и ROWS которые задают размер в символах и количество столбцов и строк в текстовом блоке.
В этом примере используется таблица; с тэгами, используемыми для создания таблиц, можно познакомиться здесь.
Форма для заполнения данными приводится ниже.
<html> <head> <title>Oтправка нового сообщения в конференцию</title> </head> <body> Отсюда вы можете отправить новое сообщение. Для этого необходимо заполнить поля ввода и нажать кнопку "Отправить". Не обязательно все поля должны быть заполнены, однако тема должна быть обязательно указана. <center><h3>Hoвoe сообщение в конференцию</center> <form method=POST action="http://myserver/cgi-bin/newmessage.exe"> <table> <tr> <td>Имя:</td> <td><input type=text name="name" size = 50> </td> </tr> <tr> <td>Teмa : </td> <td><input type=text name="subject" size = 50> </td> </tr> <tr> <td>Bam e-mail :</td> <td><input type=text name="email" size=50></td </tr> </table> Сообщение:<br> <textarea COLS = 80 ROWS = 5 name="body"></textarea> <input type=submit name="post" value="0тправить"> <input type=reset value="0чистить"> </form> </body> </html>
Приведенный HTML-документ можно взять здесь.
На следующем шаге мы рассмотрим использование формы.
Категория: 