Html формы
Некоторые WWW browser позволяют пользователю, заполнив специальную форму, возвращающую полученное значение, выполнять некоторые действия на вашем WWW-сервере. Когда форма интерпретируется WEB-броузером, создается специальные экранные элементы GUI, такие, как поля ввода, checkboxes, radiobuttons, выпадающие меню, скроллируемые списки, кнопки и т.д. Когда пользователь заполняет форму и нажимает кнопку "Подтверждение" (SUBMIT - специальный тип кнопки, который задается при описании документа), информация, введенна пользователем в форму, посылается HTTP-серверу для обработки и передаче другим программам, работающим под сервером, в соответствии с CGI (Common Gateway Interface) интерфейсом. Когда вы описываете форму, каждый элемент ввода данных имеет тэг <INPUT>. Когда пользователь помещает данные в элемент формы, инфоромация размещается в разделе VALUE данного элемента.
CGI (Common Gateway Interface) является стандартом интерфейса внешней прикладной программы и информационного сервера типа HTTP. CGI был заявлен как основной способ представления динамически генерируемой информации в WWW. Он позволяет компьютеру предлагать запрошенные пользователем данные, в противовес статическим страницам, уже сформированным их автором. В настоящий момент, CGI обладает исключительно стабильными и понятными методами создания динамических страниц. Современные пользователи хотят получать точные ответы на поставленные ими вопросы. Ушли те времена, когда они были удовлетворены неким единым отчетом. Так, каждый бухгалтер, менеджер, инженер хотят ввести некоторые специфичные для них данные и получить ответ на текущий момент времени. И, если до настоящего момента с этим справлялся обычный компьютер, то почему бы такой возможности не быть в Internet? Все это нам обещает использование спецификации CGI. Вы можете отобразить позиции продаж какого-либо продукта за выбранные интервалы времени, согласно вашему запросу, используя для наглядности различные виды диаграмм. Вы можете позволить покупателю ввести некоторое ключевое слово для поиска информации по вашей продукции. Вы также можете позволить своему серверу выполнять ряд других действий, как, например, собирать комментарии ваших посетителей, организовывать поиск по вашим архивам, вести гостевую книгу. Когда вы путешествуете по страницам WWW, вы видите ряд документов, заставляющих вас воскликнуть "Как это было сделано?". Эти документы, помимо прочего, содержат формы, требующие подтверждения вашего выбора, счетчики, показывающие количество посетителей и прочую статистику, утилиты для поиска больших массивов информации. В большинстве случаев, вы обнаружите, что эти эффекты были достигнуты благодаря использованию CGI. CGI является частью Web сервера и позволяет взаимодействовать с другими программами, находящимися на сервере. При помощи CGI, Web сервер может передавать в программу введенные пользователем данные. Далее программа производит их обработку и передает серверу для ответа в Web браузер. Давайте рассмотрим некоторые типичные приложения, которые разрабатываются на базе CGI. Формы. Одно из наиболее очевидных применений CGI - это обработка форм. Формы реализуются посредством HTML и позволяют пользователю вводить некоторую информацию. Они предоставляют пользователю и разработчику создавать интерактивную среду по обмену такой информацией. Формы могут содержать несколько типов вводимой информации. Это радио-кнопки, текстовые поля, чекбоксы (checkboxes), списки и файлы. Когда форма заполнена, пользователю предлагается нажать на кнопку подтверждения ввода для посылки информации на сервер. Сервер передает управление программе-обработчику, указанной в заголовке формы. В основном, формы используются для двух важных целей. Одна из них - сбор информации о пользователе. Другая - поиск необходимых документов на сервере по введенным атрибутам и ключевым словам. Шлюзы. Шлюзы в Web - это программы, используемые для доступа к информации, которая не может быть представлена клиенту в явном виде. К примеру, у вас установлен SQL - сервер, содержащий некоторые базы данных. Каким образом пользователю получить выборку по таблицам сервера? Вы же не станете отображать файл, физически содержащий запрошенную таблицу, либо представление. CGI предоставляет ряд решений данной проблемы в виде расширений и библиотек к языкам CGI - программирования, содержащих интерфейс к базам данных практически любого типа.Безусловно, вы можете реализовывать шлюзы для любых других информационных сервисов в Internet, включая Archie, WAIS, SMTP, NNTP. Виртуальные документы. Виртуальные документы создаются на лету в ответ на запрос пользователя. Можно создавать виртуальный HTML-документ, обычный текст, графическое изображение и даже звук. Простейший пример виртуального документа может выглядеть так: Вас приветствует Great Server. Вы пришли со страницы http://www.bagamy.net/hotel.htm Вы последний раз посещали эту страничку 3 дня назад. Счастливо оставаться! В данном примере вы видите, что сервер определил с какой страницы пришел пользователь и когда последний раз он посещал данный сервер. Обычно, большинство Web-документов бывают созданы при помощи комбинации различных приложений, форм, шлюзов и библиотек. Следующий параграф (Работа с формами. § 2) поможет Вам разобраться с внутренними механизмами работы CGI-приложений в области программирования форм.
Формы Форма - это средство, позволяющее организовать в домашней странице диалог с ее пользователем. Разработчик домашней страницы создает анкету с помощью специальных элементов: - кнопки, - списки, - текстовые строки, - текстовые поля. При зтом разработчик указывает свою программу обработки результатов анкеты. При чтении домашней страницы пользователь заполняет анкету, и, нажав на кнопку "submit" данной анкеты, отправляет ее содержимое программе обработки. Программы обработки называются CGI-скриптами и разрабатываются на различных языках программирования. А что, если Вы хотите организовать анкету, но писать программы Вы не умеете? Тогда можно отправить поток сообщений на Ваш почтовый адрес. Формы передают информацию программе обработки в виде пар: Имя поля - Значение поля. Форма начинается командой <FORM> и заканчивается командой </FORM>. Данная команда имеет 2 основных параметра: ACTION и METHOD. Параметр ACTION является обязательным. Он указывает адрес обработчика формы (например, адрес программы обработки или почтовый адрес или просто адрес URL для перехода). Параметр METHOD не является обязательным. Он принимает одно из двух значений: GET или POST , связанных с методом протокола передачи информации из анкеты. По умолчанию, METHOD= GET . Пример команды FORM: <FORM ACTION=" http://www.geocities.com/SiliconValley/99999 " METHOD= POST > Для задания управляющей кнопки запуска передачи данных надо записать следующую команду: <INPUT TYPE= submit NAME=" botton1VALUE=" Произвольный текст "> где: INPUT - команда создания управляющего элемента. TYPE - параметр, определяющий управляющий элемент. submit - значение этого параметра (в данном случае: управляющая кнопка). NAME - параметр, задающий имя переменной. botton1 - имя переменной. VALUE - параметр, задающий текст, отображаемый на управляющем элементе. Произвольный текст - значение текста на управляющем элементе. Данная кнопка имеет следующий вид: Начало формы
Конец формы Как мы уже отмечали выше, значением параметра ACTION может быть просто адрес для перехода. Поэтому простейшая форма просто возвращает нас к началу данного раздела: <FORM ACTION=" web2e.html"> <INPUT TYPE=SUBMIT VALUE=" Вернуться к началу раздела "></FORM> Перед Вами эта кнопка, проверьте ее действие: Начало формы
Конец формы В данном случае нет необходимости применять параметр NAME так как данные никуда не передаются. Обратите внимание: я сделал все кнопки возврата из разделов и кнопку перехода в мою домашнюю страницу (в начале головного раздела) по этому же принципу. Ниже приводятся основные типы управляющих злементов INPUT. 1) Текстовая строка: TYPE=text Определяет окно для ввода одной строки текста. Пример: <INPUT TYPE=text NAME=" text1 " SIZE= 30 VALUE=" Введите текст "> В полученное окно Начало формы
Конец формы Вы можете ввести любой текст или оставить записанный начальный текст Введите текст без изменений. При нажатии кнопки submit в программу обработки будет передано: text1=Введите текст (или другой, измененный текст). Параметр SIZE задает размер окна в символах. При необходимости ограничить длину текста N , применяйте дополнительный параметр: MAXLENGTH= N . 2) Окно для ввода пароля: TYPE=password Аналогичен типу text , но при вводе каждый символ заменяется символом *. Пример. Надо ввести пароль длиной не более 5 символов. <INPUT TYPE=password NAME= pass size= 10 maxlength= 5 > Введите какое-слово в полученное окно. Начало формы
Конец формы Пусть Вы ввели слово Yakov. Тогда при нажатии на кнопку submit в программу обработки будет введено: pass=Yakov 3) Текстовое окно: TEXTAREA Задается в следующем виде: <TEXTAREA NAME= text3 COLS= 30 ROWS= 5 WRAP=VIRTUAL> ..... Первоначально заданный текст ..... </TEXTAREA> Параметр COLS задает количество символов в строке, параметр ROWS задает количество строк в окне, необязательный параметр WRAP=VIRTUAL задает линейку прокрутки. Введите текст в данное окно: Начало формы Конец формы Если Вы выбрали Путевку в Париж, то при нажатии на кнопку submit в программу обработки будет введено: script=tour2 Команда SELECT может содержать аттрибут MULTIPLE, при котором можно выбрать несколько элементов меню одновременно. Высоту окна можно задать аттрибутом SIZE= N. Если в строке OPTION задан аттрибут checked, то данный элемент задается по умолчанию.
SELECT SINGLE Тэг SELECT SINGLE - это то же самое, что и Select, но на экране пользователь видит одновременно несколько элементов выбора (три по умолчанию). Если их больше, то предоставляется автоматический вертикальный скроллинг. Количество одновременно отображаемых элементов определяется атрибутом SIZE. Пример: <FORM>
SELECT MULTIPLE Тэг SELECT MULTIPLE похож на тэг SELECT SINGLE, но пользователь может одновременно выбрать более чем один элемент списка. Атрибут SIZE определяет количество одновременно видимых на экране элементов, атрибут MULTIPLE - максимальное количество одновременно выбранных элементов. Пример: <FORM> Если выбрано одновременно несколько значений, то серверу передаютс соответствующее выбранному количество параметров NAME=VALUE с одинаковыми значениями NAME, но разными VALUE. В этом примере мы используем элемент OPTGROUP для группировки вариантов. Следующая разметка: <FORM action="http://somesite.com/prog/someprog" method="post"> <P> <SELECT name="ComOS"> <OPTGROUP label="PortMaster 3"> <OPTION label="3.7.1" value="pm3_3.7.1">PortMaster 3 и ComOS 3.7.1 <OPTION label="3.7" value="pm3_3.7">PortMaster 3 и ComOS 3.7 <OPTION label="3.5" value="pm3_3.5">PortMaster 3 и ComOS 3.5 </OPTGROUP> <OPTGROUP label="PortMaster 2"> <OPTION label="3.7" value="pm2_3.7">PortMaster 2 и ComOS 3.7 <OPTION label="3.5" value="pm2_3.5">PortMaster 2 и ComOS 3.5 </OPTGROUP> <OPTGROUP label="IRX"> <OPTION label="3.7R" value="IRX_3.7R">IRX и ComOS 3.7R <OPTION label="3.5R" value="IRX_3.5R">IRX и ComOS 3.5R </OPTGROUP> </SELECT> </FORM> представляет следующую группировку: PortMaster 3 3.7.1 3.7 3.5 PortMaster 2 3.7 3.5 IRX 3.7R 3.5R
Пункты PortMaster 3, PortMaster 2 и IRX выбрать нельзя, они просто определяют имена разделов меню.
8) Кнопка ввода: TYPE=submit Это и есть та самая кнопка, о которой мы так часто вспоминали. <INPUT TYPE=submit VALUE=" Ввод данных "> Эта команда отображается следующим образом: Начало формы
Конец формы 9) Кнопка отмены: TYPE=reset Кнопка выполняет инициализацию начальными значениями всех полей. <INPUT TYPE=reset VALUE=" Очистить поля "> Эта команда отображается следующим образом: Начало формы
Конец формы
Отправление файлов при помощи форм Формы можно использовать для отправки не только небольших информационных сообщений в виде параметров, а также и для отправки файлов. Внимание! Поскольку данная возможность требует поддержки получения файлов WEB-сервером, то, соответственно, необходимо, чтобы сервер поддерживал получение файлов! Например: <FORM ENCTYPE="multipart/form-data" ACTION="url" METHOD=POST> Отправить данный файл: <INPUT NAME="userfile" TYPE="file"> <P> <INPUT TYPE="submit" VALUE="Отправить файл"> </FORM> Начало формы Отправить данный файл:
Конец формы
|
