Ознакомьтесь со следующей процедурой, чтобы узнать, как визуально создать веб-форму в Dreamweaver путем вставки элементов формы на страницу.

Визуально создать веб-форму в Dreamweaver можно путем вставки элементов формы на страницу, однако это лишь часть процесса. Другая, более сложная часть заключается в разработке механизма обработки данных, которые посетители отправляют с помощью формы. Например, данные иногда сохраняются в клиентской базе данных. Как правило, технология веб-приложений, такая как PHP или Adobe ColdFusion, позволяет обрабатывать данные форм.

В этой статье описаны способы создания простой веб-формы. Разработка механизма обработки отправленных в формах данных не рассматривается в этой статье. Подробные инструкции по созданию форм и механизму обработки отправленных данных с помощью PHP см. в этой серии учебников в центре разработчиков Adobe.

Создание веб-формы

  1. Откройте страницу в представлении «Дизайн» окна Dreamweaver и поместите курсор вставки в место, где должна появиться форма.
  2. Выберите пункты меню «Вставка» > «Форма» > «Форма». Или выберите категорию «Формы» на панели «Вставка» (маленький треугольник под вкладкой панели) и щелкните значок «Форма». Dreamweaver вставляет пустую форму. В представлении «Дизайн» формы обозначены красным пунктирным контуром. Если этот контур не отображается, выберите меню «Просмотр» > «Вспомогательные элементы» > «Невидимые элементы».
  3. Укажите страницу или сценарий, который обрабатывает данные формы. Чтобы выбрать форму, щелкните контур формы в окне документа. В инспекторе свойств («Окно» > «Свойства») введите имя файла (и путь при необходимости) страницы обработки в текстовом поле «Действие» инспектора свойств. Или щелкните значок папки, чтобы выбрать соответствующую страницу или сценарий. Пример: process_order.php.
  4. Укажите метод, который будет использоваться для передачи данных формы на сервер. В инспекторе свойств выберите один из следующих параметров во всплывающем меню «Метод».
    • POST — вставляет данные формы в HTTP-запрос. Для получения дополнительных сведений см. параметры HTML-форм в справке по Dreamweaver.
    • GET — добавляет значение в URL-адрес, запрашивающий страницу. Для получения дополнительных сведений см. параметры URL-адресов в справке по Dreamweaver.
    • По умолчанию — для отправки данных формы на сервер будет использована настройка браузера по умолчанию. Как правило, значение по умолчанию — метод GET.
  5. Вставьте объекты формы. Поместите курсор вставки туда, где нужно разместить объект формы. Затем выберите объект в меню «Вставка» > «Форма» или в категории «Формы» на панели «Вставка». Разместите объекты формы внутри красного пунктирного контура формы на странице. Более подробные сведения об объектах форм см. в разделе Объекты форм в справке по Dreamweaver.

  6. Измените макет формы. Для форматирования форм используйте разрывы строк, разрывы абзацев, предварительно форматированный текст или таблицы. Нельзя вставлять форму в другую форму, однако на странице можно разместить несколько форм. При разработке форм не забудьте добавить метки к объектам формы с поясняющим текстом, чтобы пользователи понимали, для чего эти объекты предназначены. Например, создайте метку «Введите свое имя» для запроса имени. Используйте таблицы для структурирования объектов формы и меток. Убедитесь, что все теги table заключены между тегами form.

Эта работа лицензируется в соответствии с лицензией Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported  На посты, размещаемые в Twitter™ и Facebook, условия Creative Commons не распространяются.

Правовые уведомления   |   Политика конфиденциальности в сети Интернет