С помощью компонента Save Results, FrontPage может помочь вам сохранить информацию из вашей формы в файле или послать ее по электронной почте. Создав форму, добавив текстовые поля или другие объекты для ввода посетителями данных, вы можете указать FrontPage, где сохранять или куда посылать информацию, и в каком формате все это делать. Чтобы сохранять результаты, FrontPage использует специальную программу, являющуюся частью FrontPage Server Extensions.
Если на вашем сервере расширение не установлено или не сконфигурировано, или если вы не делали необходимых настроек вашей формы, вы можете не получить нужных результатов. Чтобы разобраться с проблемой и доставить информацию по адресу, сделайте следующее.
Если страница находится на диске, где расширения FrontPage Server Extensions не установлены, то форма не будет работать в броузере. (Вы сможете просмотреть страницу, но если вы отправите форму, то увидите страницу с ошибкой, озаглавленную "FrontPage Run-Time Component Page", и информация не будет сохранена.)
Чтобы использовать форму, опубликуйте страницу на сервере, содержащем FrontPage Server Extensions, а затем просмотрите страницу уже на нем.
Вы указывали пункт назначения для результатов формы? Если нет, у вас возникнут проблемы с поиском информации, отправленной через форму. По умолчанию FrontPage сохраняет результаты формы в текстовом файле. Она называется form_results.txt и хранится в папке _private вашей страницы. Вы вряд ли сможете открыть этот файл в броузере, поскольку FrontPage, из соображений безопасности, делает папку _private нечитаемой. Чтобы ее просмотреть, нажмите строку Folders в меню View, дважды щелкните на папке _private и дважды щелкните на form_results.txt.
Чтобы изменить положение файла, который FrontPage использует для результатов формы, щелкните правой кнопкой на форме, нажмите Form Properties и введите путь и имя файла в поле ввода File Name. Чтобы изменить формат файла с простого текста на что-то другое, нажмите Options и выберите опцию в окне File Format.
Большинство форм разработаны для того, чтобы получать информацию от посетителей вашей страницы и отправлять ее сценарию или программе на веб-сервере. В тэге <FORM> вы используете атрибут action, чтобы указать, к какому сценарию или программе прибегнуть, когда посетитель отправит форму. Например, если вы создаете форму, чтобы посетители послали вам e-mail, посетители вводят имя, адрес электронной почты и необходимые вам сведения. Затем форма отправляет эту информацию программе Common Gateway Interface (CGI) или серверному сценарию, такому как Active Server Pages (ASP), который отправляет e-mail. Чтобы работать, ваша программа должна быть правильно сконфигурирована для сервера и иметь все необходимые возможности. Кроме того, форма должна отсылать программе правильную информацию, используя тэги <INPUT> с правильными именами и параметрами. В некоторых случаях вам необходимо отправлять дополнительную информацию программе, используя скрытые поля – тэги <INPUT> с информацией, которыя не должна появляться на фор ме, как, к примеру, адрес e-mail, по которому вы хотите отправлять информацию. Если с каким-нибудь из этих пунктов что-то не в порядке, форма может не заработать.
Чтобы диагностировать и решить проблему с формой, сделайте следующее.
Чтобы получать информацию от посетителей, вы добавили поля к своей форме. Возможно, вы пользуетесь программой дизайна, такой как FrontPage, или создали форму в HTML, используя тэги <FORM>, <INPUT> и <SELECT>, но при предварительном просмотре поля не выровнены и выглядят неряшливо.
Чтобы привести форму в порядок, есть две возможности. Первая – использовать преформатированный текст (preformatted text), с которым броузер использует моношириные шрифты, показывает разбивку и разрывы строки в точности так, как показано в вашем HTML. (Обычно броузеры сливают множественные пробелы или разрывы строки в один пробел.) Вторая возможность – использовать таблицу, контролирующую размещение элементов в вашей форме. В любом случае вам придется отрегулировать размеры полей, чтобы подравнять форму. Если форма не выглядит должным образом, cделайте следующее.
Отрегулируйте ширину текстовых полей, так чтобы одинаковые поля имели одинаковый размер. В тэгах <INPUT> укажите атрибут size.
<input type="text"name="realname"size="34"> <input type="text"name="email"size="34">
Если вы используете FrontPage, щелкните на каждом поле и отрегулируйте размер вручную.
Чтобы упорядочить вашу форму, используйте один из следующих методов.
Броузеры могут отправлять информацию из формы двумя способами: GET и POST. Способом GET величины формы добавляются в конец URL и отделяются от них знаком вопроса, примерно таким образом:
http://www.risingmoon.com/order.asp?Entree=Bird&Salad=Blue&Coffee=Please
Как вы видите, если у вас много полей, метод GET становится неудобным. Но у GET есть интересный побочный эффект. Когда посетители делают закладку на странице, значения полей сохраняются, таким образом, когда посетитель возвращается на страницу, величины уже введены. GET – метод по умолчанию, но POST используется для многих типов форм. Форма отправляет такую же информацию, но вместо перемещения URL она перемещается как серия заголовков HTTP. Чтобы отправить форму используя POST, установите атрибут method в тэге <FORM>:
<form method="POST"action="order.asp">
Если вы не хотите, чтобы посетители видели отсылаемые ими величины и могли воспользоваться ими снова, используйте POST.
Простейший способ выравнивания текста в форме – использовать тэг <PRE>, чтобы отобразить разбивку в точности как в вашем HTML. Броузер использует моноширинный шрифт, такой как Courier, таким образом каждый символ или пробел занимают одинаковую ширину на странице.
Если вы не хотите использовать моноширинные шрифты, используйте таблицу для точного выравнивания элементов.
Чтобы отрегулировать разбивку между полями, установите атрибут cellpadding в тэге <TABLE>. (Во FrontPage щелкните правой кнопкой по таблице, нажмите Table Properties и введите значение в окно Cell Padding.) Вот на что должен быть похож ваш HTML:
<H2 align=center>Argus the Answer Dog</H2> <form method="POST"action="argus.cgi"> <table cellpadding=5> <tr> <td ><b>Your name:</b></td> <td><input type="text"name="name" size=34></td> </tr> <tr> <td ><b>Your email:</b></td> <td><input type="text"name="email" size=34></td> </tr> <tr> <td ><b>Your question:</b></td> <td><textarea name="question"rows=3 cols=29></textarea></td> </tr> <tr> <td align=center colspan=2> <input type="image"src="argusbtn.gif"width=94 height=94></td> </tr> </table> </form>
Чтобы помочь людям с отправкой информации через форму, вы можете использовать кнопки выбора, флажки и списки. Таким образом, посетители смогут просто выбрать один из предложенных вами вариантов. В HTML вы включаете такие поля в тэгах <INPUT> со значениями атрибутов типа radio или checkbox, и в блоках <SELECT> в тэгах <OPTION>, где указываются строки для списков.
Если вы не установили тэги должным образом, вы можете не получить нужных величин или ваша форма может вообще не заработать.
Если ваши кнопки выбора, флажки или списки не работают, сделайте следующее.
Если ваша форма отсылает информацию сценарию или базе данных, проверьте имена полей и значений, необходимых сценарию или базе данных. Если форма отправляет информацию в файл или посылает ее по e-mail, выберите имена полей и величины, которые передадут всю необходимую вам информацию наилучшим образом.
Как вы уже поняли, очень важно знать, какое имя поля и какой набор величин вам нужен.
Для кнопок выбора в тэге <INPUT> для атрибута type установите radio, убедитесь, что вы дали каждой кнопке в группе одинаковый атрибут name, но разный атрибут value. (Имя идентифицирует группу кнопок, а значение сообщает форме, что отправить, когда каждая кнопка выделена.)
Иначе ваша форма не объединит кнопки в группу или не отправит нужное значение выбранной опции. Текст, отображенный в окне, не обязательно такой же, как и отправляемая величина – величина часто является аббревиатурой.
Следующий HTML создает группу кнопок выбора (первая из них выбрана по умолчанию), отправляющих одно из четырeх значений поля Entree:
<p>Main Course:<br> <input type="radio"name="Entree"value="Bird"checked>Pheasant<br> <input type="radio"name="Entree" value="Burger">Hamburger ala Bun<br> <input type="radio"name="Entree" value="Seafood">Mussels and Squids<br> <input type="radio"name="Entree" value="Beancurd">Tofu Fondue</p>
В Netscape 4 кнопки выбора всегда используют фон страницы. Если фон вашей формы или таблицы, которая ее содержит, не совпадает с фоном страницы, вы будете видеть вокруг ваших кнопок выбора квадратные окошки. Поскольку Netscape 4 поддерживает каскадированные таблицы стилей (CSS), вы можете легко решить эту проблему.
Сделайте следующее.
Используя атрибут style тэга <INPUT>, установите параметр background-color CSS каждой из кнопок выбора таким же, как цвет фона формы.
Например, ваш HTML может выглядеть так:
<form> <p>This is a test of:<br> <input type="radio"name="ttype"value="nav" style="background-color:#cc3333"checked> Netscape Navigator<br> <input type="radio"name="ttype"value="ie" style="background-color:#cc3333"> Internet Explorer<br> <input type="radio"name="ttype"value="ebs" style="background-color:#cc3333"> The Emergency Broadcast System</p>
Просмотрите результат во всех броузерах, чтобы убедиться, что цвета в порядке.
FrontPage может написать сценарий, проверяющий содержимое всех полей, вам надо указать лишь, каките значения проверять и какой тип данных в них должен содержаться.
Большинство веб-серверов позволяют вам отправлять e-mail со страницы. Многие провайдеры, работающие под UNIX и Linux, предоставляют бесплатный сценарий Perl под названием formmail.pl или formmail.cgi, который вы можете использовать для отправки письма. Большинство провайдеров позволяют вам разместить собственный сценарий на сервере. Следующая форма, например, собирает информацию и использует formmail.cgi, чтобы отправить сообщение.
<form action="formmail.cgi"method="POST"> <input type="hidden"name="recipient"value="mailme@callahansoftware.com"> <input type="hidden"name="subject"value="Web Form Response"> <p>Your name:<br> <input type="text"name="realname"size=24 maxlength=60></p> <p>Your email:<br> <input type="text"name="email"size=24 maxlength=60></p> <p>Your message:<br> <textarea name="message"cols=40 rows=8></textarea></p> <p><input type="submit"value="Send Message"></p> </form>
Если ваш сервер использует Windows и Internet Information Server (IIS), вы можете написать ваш собственный сценарий ASP. Следующий сценарий, например, отправляет информацию из вышеуказанной формы:
<%’FormMail.asp -Sends e-mail using the CDONTS Newmail object. Set objMail =CreateObject("CDONTS.Newmail") objMail.From =Request("realname")&"<"&Request("email")&">" objMail.To =Request("recipient") objMail.Subject =Request("subject") objMail.Body =Request("message") objMail.Send %>
Если вы используете веб-сервера под управлением UNIX или Linux, учтите, что имена файлов учитывают регистр, и FormMail.cgi – не то же самое, что и formmail.cgi.Многие люди не любят печатать, они предпочтут оставить поле незаполненым. Если эта информация вам очень нужна, вам придется предоставить посетителям некоторые удобства. Один из способов: поддерживать величины по умолчанию и отмечать поля, обязательные для заполнения. Другой путь – добавить сценарий проверки на корректность (validation script) – JavaScript, запускаемый при отправке формы и проверяющий содержимое всех необходимых полей. Если такой сценарий обнаруживает незаполненные поля, он выводит сообщение и не отправляет форму. Наконец, вы можете проверять информацию формы при ее попадании на серверный сценарий или программу уже после отправки, и выводить ошибку или возвращать форму.
Если посетители отправляют форму без необходимой информации, сделайте следующее.
Чтобы минимизировать количество текста, которое придется набить вашим посетителям, используйте кнопки выбора, флажки и списки там, где это возможно. Например, вместо того чтобы просить посетителей написать причину их интереса, сделайте список, из которого они могли бы выбрать. Поставьте выбор по умолчанию для кнопок выбора или флажков, используйте атрибут checked в тэге <INPUT>; для списков используйте атрибут selected в тэге <OPTION>.
Чтобы поля с ключевой информацией, такой как имя посетителя, не оставались незаполнеными, используйте на странице сценарий проверки на корректность. Например, следующая функция JavaScript проверяет заполненость полей realname и email. Если поля пустые, сценарий выводит сообщение от броузера и указывает на незаполненные поля.
<script language="JavaScript"> <!-- function validate(form){ //Check for name and e-mail entries. if (form.realname.value ==""){ alert("Please type your name."); form.realname.focus(); return false;//Don’t submit the form } else if (form.email.value ==""){ alert("Please type your e-mail address."); form.email.focus(); return false; //Don’t submit the form } return true; //Required fields are there -submit the form } //--> </script>
Чтобы использовать этот сценарий, вставьте код в раздел <HEAD> вашей страницы. Затем присоедините функцию к событию onSubmit вашей формы как указано ниже, тогда функция будет выполняться броузером прежде, чем информация будет отправлена сетевому сценарию. (Утверждение return указывает, что форма не отправится, если сценарий обнаружит пропущенную информацию.)
<form action="formmail.cgi"method=POST onSubmit="return validate(this)">
Другие идеи насчет сценариев проверки на корректность см. в сети или в Приложении C.
Если вы не хотите выводить сообщение, вам могут помочь серверный сценарий или программа. Если неверная информация уже отправлена, простейшим решением будет вывести страницу с ошибкой, предлагающую посетителю нажать в своем броузере кнопку Back и заполнить оставшиеся поля. Вы можете также отобразить форму заново, оставив всю имеющуюся информацию и подсветив незаполненные поля.
Когда вы используете атрибут размера поля <INPUT>, чтобы установить ширину поля, Netscape и Internet Explorer воспринимают ваши настройки по-разному. Это происходит потому, что Internet Explorer использует в текстовых окнах пропорциональный шрифт, в то время как Netscape использует моноширинный шрифт, который шире.
Чтобы добиться одинаковой ширины текстовых окон в большинстве броузеров, сделайте следующее.
Если вы хотите использовать моноширинный шрифт, самое простое решение – указать шрифт в стиле к тэгу <INPUT>. Поместите этот код в раздел <HEAD> вашей страницы:
<style> input {font-family:'courier new', courier,monospace } </style>
Если вы хотите использовать пропорциональный шрифт в Internet Explorer, используйте стиль, чтобы установить ширину каждого текстового окна:
<input type="text"name="email"size=32 style="width:260px">
Поскольку Netscape 4 игнорирует этот стиль, вы должны сначала указать атрибут size, просмотрев страницу в Netscape 4, чтобы убедиться в правильности размеров текстового окна. Затем отрегулируйте параметр width в пикселях, чтобы он был таким же, как в Internet Explorer.
Просмотрите вашу страницу в обоих броузерах и, если возможно, на разных компьютерах.