Изменение размещения элементов формы ввода

izmenenie razmeshheniya elementov formy vvoda Сценарии на стороне сервера

Предположим, что вы написали систему, подобную той, что была представлена в предыдущем разделе, а ваши пользователи, клиенты и «вторая половина» начали жаловаться, что форму ввода трудно читать. Не волнуйтесь. Поскольку модель CGI естественным образом отделяет интер фейс пользователя (описание страницы HTML) от ло ги ки обра бот ки (сценария CGI), можно совершенно безболезненно изменить структуру формы. Достаточно просто модифицировать файл HTML, при этом изменять программный код CGI не понадобится. Так, в примере 15.13 приводится новое определение формы ввода, где таблицы используются несколько иначе, обеспечивая более красивую разметку с границами.

Пример 15.13. PP4E\Internet\Web\tutor5b.html

<HTML><TITLE>CGI 101</TITLE>

<BODY>

<H1>Common input devices: alternative layout</H1>

<P>Use the same tutor5.py server side script, but change the layout of the form itself. Notice the separation of user interface and processing logic here; the CGI script is independent of the HTML used to interact with the user/client.</P><HR>

<FORM method=POST action="cgi-bin/tutor5.py">

<H3>Please complete the following form and click Submit</H3>

<P><TABLE border cellpadding=3>

<TR>

<TH align=right>Name:

<TD><input type=text name=name>

<TR>

<TH align=right>Shoe size:

<TD><input type=radio name=shoesize value=small>Small

<input type=radio name=shoesize value=medium>Medium

<input type=radio name=shoesize value=large>Large

<TR>

<TH align=right>Occupation:

<TD><select name=job>

<option>Developer

<option>Manager

<option>Student

<option>Evangelist

<option>Other

</select>

<TR>

<TH align=right>Political affiliations:

<TD><P><input type=checkbox name=language value=Python>Pythonista <P><input type=checkbox name=language value=Perl>Perlmonger <P><input type=checkbox name=language value=Tcl>Tcler

<TR>

<TH align=right>Comments:

<TD><textarea name=comment cols=30 rows=2> Enter spam here</textarea>

<TR>

<TD colspan=2 align=center>

<input type=submit value="Submit">

<input type=reset value="Reset">

</TABLE>

</FORM>

</BODY></HTML>

Если открыть в броузере эту альтернативную страницу, мы получим интерфейс, показанный на рис. 15.15.

Теперь, прежде чем вы попытаетесь найти отличия между этим файлом HTML и предыдущим, я должен отметить, что отличия в HTML, порождающем эту страницу, значительно менее важны, чем то обстоятельство, что атрибуты action форм этих двух страниц ссылаются на одинаковые адреса URL. Нажатие кнопки Submit (Отправить) в этой версии вызывает запуск того же самого и совершенно не изменившегося CGI-сценария Python tutor5.cgi (пример 15.12).

Это означает, что сценарии совершенно не зависят от структуры интерфейса пользователя, с помощью которого им отправляется информация. Изменения страницы ответа требуют, конечно, изменения сценария, но код HTML разметки страницы с формой ввода можно изменять по своему вкусу, и это не оказывает влияния на программный код Python, выполняемый на сервере. На рис. 15.16 показана страница ответа, порождаемая сценарием на этот раз.

Рис. 15.15. Страница формы, созданная файлом tutor5b.html

 

 

Использованная литература:

Марк Лутц — Программирование на Python, 4-е издание, II том, 2011

Каталог сайтов Всего.ру
Оцените статью
Секреты программирования
Добавить комментарий