Руководство пользователя Отмена

Создание страниц поиска и результатов поиска

  1. Руководство пользователя Dreamweaver
  2. Введение
    1. Основы гибкого веб-дизайна
    2. Новые возможности Dreamweaver
    3. Веб-разработка с помощью Dreamweaver: обзор
    4. Dreamweaver / распространенные вопросы
    5. Сочетания клавиш
    6. Системные требования Dreamweaver
    7. Обзор новых возможностей
  3. Dreamweaver и Creative Cloud
    1. Синхронизация настроек Dreamweaver с Creative Cloud
    2. Библиотеки Creative Cloud Libraries в Dreamweaver
    3. Использование файлов Photoshop в Dreamweaver
    4. Работа с Adobe Animate и Dreamweaver
    5. Извлечение файлов SVG, оптимизированных для Интернета, из библиотек
  4. Рабочие среды и представления Dreamweaver
    1. Рабочая среда Dreamweaver
    2. Оптимизация рабочей среды Dreamweaver для визуальной разработки
    3. Поиск файлов по названию или содержимому | Mac OS
  5. Настройка сайтов
    1. О сайтах Dreamweaver
    2. Настройка локальной версии сайта
    3. Подключение к серверу публикации
    4. Настройка тестового сервера
    5. Импорт и экспорт параметров сайта Dreamweaver
    6. Перенос существующих веб-сайтов с удаленного сервера в корневой каталог локального сайта
    7. Специальные возможности в Dreamweaver
    8. Дополнительные настройки
    9. Настройка установок сайта для передачи файлов
    10. Задание параметров прокси-сервера в Dreamweaver
    11. Синхронизация настроек Dreamweaver с Creative Cloud
    12. Использование Git в Dreamweaver
  6. Управление файлами
    1. Создание и открытие файлов
    2. Управление файлами и папками
    3. Получение файлов с сервера и размещение их на нем
    4. Возврат и извлечение файлов
    5. Синхронизация файлов
    6. Сравнение файлов
    7. Скрытие файлов и папок на сайте Dreamweaver
    8. Включение заметок разработчика для сайтов Dreamweaver
    9. Предотвращение использования уязвимости Gatekeeper
  7. Макет и оформление
    1. Использование средств визуализации для создания макета
    2. Об использовании CSS для создания макета страницы
    3. Создание динамичных веб-сайтов с помощью Bootstrap
    4. Создание и использование медиазапросов в Dreamweaver
    5. Представление содержимого в таблицах
    6. Цвета
    7. Гибкий дизайн с использованием «резиновых» макетов
    8. Extract в Dreamweaver
  8. CSS
    1. Общие сведения о каскадных таблицах стилей
    2. Создание макетов страниц с помощью конструктора CSS
    3. Использование препроцессоров CSS в Dreamweaver
    4. Установка настроек стиля CSS в Dreamweaver
    5. Перемещение правил CSS в Dreamweaver
    6. Преобразование встроенного CSS в правило CSS в Dreamweaver
    7. Работа с тегами div
    8. Применение градиентов к фону
    9. Создание и редактирование эффектов перехода CSS3 в Dreamweaver
    10. Форматирование кода
  9. Содержимое страницы и ресурсы
    1. Задание свойств страницы
    2. Задание свойств заголовка CSS и свойств ссылки CSS
    3. Работа с текстом
    4. Поиск и замена текста, тегов и атрибутов
    5. Панель DOM
    6. Редактирование в режиме интерактивного просмотра
    7. Кодировка документов в Dreamweaver
    8. Выбор и просмотр элементов в окне документа
    9. Задание свойств текста в инспекторе свойств
    10. Проверка орфографии на веб-странице
    11. Использование горизонтальных линеек в Dreamweaver
    12. Добавление и изменение сочетаний шрифтов в Adobe Dreamweaver
    13. Работа с ресурсами
    14. Вставка и обновление даты в Dreamweaver
    15. Создание и управление избранными ресурсами в Dreamweaver
    16. Вставка и редактирование изображений в Dreamweaver
    17. Добавление мультимедийных объектов
    18. Добавление видео Dreamweaver
    19. Добавление видео HTML5
    20. Вставка файлов SWF
    21. Добавление звуковых эффектов
    22. Добавление аудио HTML5 в Dreamweaver
    23. Работа с элементами библиотеки
    24. Использование текста на арабском языке и иврите в Dreamweaver
  10. Создание ссылок и навигация
    1. О создании ссылок и навигации
    2. Создание ссылок
    3. Карты ссылок
    4. Устранение неполадок со ссылками
  11. Графические элементы и эффекты jQuery
    1. Использование пользовательского интерфейса и графических элементов jQuery для мобильных устройств в Dreamweaver
    2. Использование эффектов jQuery в Dreamweaver
  12. Написание кода веб-сайтов
    1. О программировании в Dreamweaver
    2. Среда написания кода в Dreamweaver
    3. Настройка параметров написания кода
    4. Настройка цветового оформления кода
    5. Написание и редактирование кода
    6. Подсказки по коду и автозавершение кода
    7. Свертывание и развертывание кода
    8. Повторное использование фрагментов кода
    9. Анализ Linting для проверки кода
    10. Оптимизация кода
    11. Редактирование кода в представлении «Дизайн»
    12. Работа с содержимым заголовков для страниц
    13. Вставка серверных включений в Dreamweaver
    14. Использование библиотек тегов в Dreamweaver
    15. Импорт пользовательских тегов в Dreamweaver
    16. Использование вариантов поведения JavaScript (общие инструкции)
    17. Применение встроенных вариантов поведения JavaScript
    18. Сведения об XML и XSLT
    19. Выполнение XSL-преобразования на стороне сервера в Dreamweaver
    20. Выполнение XSL-преобразования на стороне клиента в Dreamweaver
    21. Добавление символьных сущностей для XSLT в Dreamweaver
    22. Форматирование кода
  13. Процессы взаимодействия продуктов
    1. Установка и использование расширений в Dreamweaver
    2. Обновления в Dreamweaver, устанавливаемые через приложение
    3. Вставить документы Microsoft Office в Dreamweaver (только для Windows)
    4. Работа с Fireworks и Dreamweaver
    5. Редактирование содержимого на сайтах Dreamweaver с помощью Contribute
    6. Интеграция Dreamweaver с Business Catalyst
    7. Создание персонализированных кампаний почтовой рассылки
  14. Шаблоны
    1. О шаблонах Dreamweaver
    2. Распознавание шаблонов и документов на их основе
    3. Создание шаблона Dreamweaver
    4. Создание редактируемых областей в шаблонах
    5. Создание повторяющихся областей и таблиц в Dreamweaver
    6. Использование дополнительных областей в шаблонах
    7. Определение редактируемых атрибутов тега в Dreamweaver
    8. Создание вложенных шаблонов в Dreamweaver
    9. Редактирование, обновление и удаление шаблонов
    10. Экспорт и импорт XML-содержимого в Dreamweaver
    11. Применение или удаление шаблона из существующего документа
    12. Редактирование содержимого в шаблонах Dreamweaver
    13. Правила синтаксиса для тегов шаблона в Dreamweaver
    14. Настройка предпочтений выделения для областей шаблона
    15. Преимущества использования шаблонов в Dreamweaver
  15. Мобильные и многоэкранные устройства
    1. Создание медиазапросов
    2. Изменение ориентации страницы для мобильных устройств
    3. Создание веб-приложений для мобильных устройств с помощью Dreamweaver
  16. Динамические сайты, страницы и веб-формы
    1. Общие сведения о веб-приложениях
    2. Настройка компьютера для разработки приложений
    3. Устранение неполадок подключений к базам данных
    4. Удаление сценариев подключения в Dreamweaver
    5. Дизайн динамических страниц
    6. Обзор динамических источников содержимого
    7. Определение источников динамического содержимого
    8. Добавление динамического содержимого на страницы
    9. Изменение динамического содержимого в Dreamweaver
    10. Отображение записей баз данных
    11. Введение интерактивных данных и устранение неполадок с ними в Dreamweaver
    12. Добавление заказных вариантов поведения сервера в Dreamweaver
    13. Создание форм с помощью Dreamweaver
    14. Использование форм для сбора информации от пользователей
    15. Создание и включение форм ColdFusion в Dreamweaver
    16. Создание веб-форм
    17. Расширенная поддержка HTML5 для компонентов формы
    18. Разработка формы с помощью Dreamweaver
  17. Визуальное построение приложений
    1. Создание главной страницы и страницы сведений в Dreamweaver
    2. Создание страниц поиска и результатов поиска
    3. Создание страницы для вставки записи
    4. Создание страницы обновления записи в Dreamweaver
    5. Создание страниц удаления записей в Dreamweaver
    6. Применение ASP-команд для изменения базы данных в Dreamweaver
    7. Создание страницы регистрации
    8. Создание страницы входа
    9. Создание страницы с доступом только для авторизованных пользователей
    10. Защита папок в ColdFusion с помощью Dreamweaver
    11. Использование компонентов ColdFusion в Dreamweaver
  18. Тестирование, просмотр и публикация веб-сайтов
    1. Предварительный просмотр страниц
    2. Предварительный просмотр веб-страниц Dreamweaver на нескольких устройствах
    3. Тестирование сайта Dreamweaver
  19. Устранение неполадок
    1. Исправленные ошибки
    2. Выявленные неполадки

 

 

Примечание.

Пользовательский интерфейс в Dreamweaver и более поздних версиях стал проще. В результате этого некоторые функции, описанные в этой статье, могут отсутствовать в Dreamweaver и более поздних версиях. Дополнительные сведения см. в этой статье.

О страницах поиска и результатов поиска

Dreamweaver можно использовать для создания набора страниц, чтобы пользователи могли выполнять поиск в вашей базе данных и просматривать результаты поиска.

В большинстве случаев для добавления этой функций в веб-приложение требуется не менее двух страниц. Первая страница содержит HTML-форму, в которую пользователи вводят параметры поиска. Хотя на этой странице поиск фактически не выполняется, ее называют страницей поиска.

Вторая страница — это страница результатов, выполняющая большую часть работы. Страница результатов выполняет следующие задачи:

  • считывание параметров поиска, отправленных страницей поиска;

  • подключение к базе данных и поиск записей;

  • создание набора записей с найденной записью;

  • отображение содержимого набора записей.

    Дополнительно можно добавить страницу сведений. Страница сведений содержит дополнительную информацию о записи на странице результатов.

    При наличии только одного параметра поиска Dreamweaver позволяет добавлять функции поиска в веб-приложение, не используя запросы SQL и переменные. Просто разработайте свои страницы и заполните данные в нескольких диалоговых окнах. Если имеется несколько параметров поиска, необходимо создать SQL-оператор и определить для него несколько переменных.

    Dreamweaver вставляет запрос SQL на вашу страницу. Когда страница выполняется на сервере, проверяются все записи в таблице базы данных. Если указанное в записи поле соответствует условиям SQL-запроса, запись включается в набор записей. SQL-запрос, в сущности, создает набор записей, содержащий только результаты поиска.

    Например, персонал сбыта на местах может получить информацию о заказчиках с доходом выше определенного уровня, проживающих в определенных районах. В форме на странице поиска сотрудник задает географическую область и минимальный уровень дохода, затем нажимает кнопку «Отправить» для передачи на сервер двух значений. На сервере значения передаются в SQL-оператор страницы результатов, который создает набор записей, содержащий только заказчиков в указанной географической области с доходом, превышающим заданный уровень.

Создание страницы поиска

Веб-страница поиска, как правило, содержит поля формы, в которые пользователи вводят параметры поиска. Страница поиска как минимум должна содержать HTML-форму и кнопку «Отправить».

Для добавления к странице поиска HTML-формы выполните следующие действия.

  1. Откройте страницу поиска или создайте новую страницу и выберите меню «Вставка» > «Форма» > «Форма».

    На странице создается пустая форма. Возможно, потребуется включить отображение невидимых элементов («Просмотр» > «Вспомогательные элементы» > «Невидимые элементы») для просмотра границ формы, представленных тонкой красной линией.

  2. Выберите в меню «Вставка» пункт «Форма» и добавьте объекты формы, позволяющие пользователям вводить параметры поиска.

    Объекты формы включают текстовые поля, меню, параметры и переключатели. Можно добавить сколько угодно объектов формы, позволяющих пользователям уточнить поиск. Но следует учесть, что, чем больше параметров поиска на странице поиска, тем сложнее должен быть SQL-оператор.

  3. Добавьте к форме кнопку «Отправить» («Вставка» > «Форма» > «Кнопка»).
  4. Для изменения метки кнопки «Отправить» выделите кнопку, откройте инспектор свойств («Окно» > «Свойства») и введите новое значение в поле «Значение» (необязательно).

    Затем укажите, куда форма должна отправлять параметры поиска при нажатии пользователем кнопки «Отправить».

  5. Выделите форму с помощью выбора тега <form> в селекторе тегов в нижней части окна документа, как это показано на следующем рисунке:
    Тег form

  6. В поле «Действие» инспектора свойств формы введите имя файла страницы результатов, выполняющей поиск в базе данных.
  7. Во всплывающем меню «Метод» выберите один из следующих методов для определения порядка отправки формой данных на сервер.
    • GET — отправка данных формы с помощью их присоединения к URL-адресу в строке запроса. Поскольку URL-адреса ограничены 8192 символами, не используйте метод GET с большими формами.

    • POST — отправка данных формы в теле сообщения.

    • Default — используется метод браузера по умолчанию (обычно GET).

      Страница поиска создана.

Создание основной страницы результатов

Когда пользователь нажимает кнопку формы «Поиск», параметры поиска передаются на страницу результатов на сервере. Страница результатов на сервере (не путать со страницей результатов в браузере) выполняет извлечение записей из базы данных. Если страница поиска передает на сервер один параметр поиска, можно создать страницу результатов без SQL-запросов и переменных. Создайте основной набор записей с фильтром, исключающим записи, не удовлетворяющие параметру поиска, отправленному со страницы поиска.

Примечание.

При нескольких условиях поиска необходимо определить набор записей в расширенном диалоговом окне «Набор записей». См. раздел Создание расширенной страницы результатов .

Создание набора записей для результатов поиска

  1. Откройте в окне документа страницу результатов.

    Если страница результатов еще не создана, создайте пустую динамическую страницу («Файл» > «Создать» > «Пустая страница»).

  2. Создайте набор записей. Для этого откройте панель «Привязки» («Окно» > «Привязки»), нажмите кнопку (+) и выберите во всплывающем меню «Набор записей».
  3. Убедитесь, что открыто простое диалоговое окно «Набор записей».
    Диалоговое окно «Набор записей»

    Примечание.

    Если открыто расширенное диалоговое окно, переключитесь на простое окно, нажав кнопку «Простой».

  4. Задайте имя набора записей и выберите подключение.

    Необходимо выполнить подключение к базе данных, содержащей данные для поиска.

  5. Во всплывающем меню «Таблица» выберите таблицу для поиска в базе данных.
    Примечание.

    При использовании одного параметра поиска можно выполнить поиск записей только в одной таблице. Для одновременного поиска в нескольких таблицах необходимо в расширенном диалоговом окне «Набор записей» задать SQL-запрос.

  6. Для включения в набор записей только некоторых столбцов таблицы нажмите «Выбрано» и выберите в списке нужные столбцы, удерживая нажатой клавишу Control (Windows) или Command (Macintosh).

    Необходимо выбрать только столбцы с информацией, которую требуется отобразить на странице результатов.

    Не закрывайте диалоговое окно «Набор записей». Оно будет использоваться для извлечения параметров, отправленных страницей поиска, и для создания фильтра набора записей, исключающего записи, не удовлетворяющие параметрам поиска.

Создание фильтра набора записей

  1. В первом всплывающем меню в области «Фильтр» выберите столбец в таблице базы данных, в котором выполняется поиск соответствия.

    Например, если значение, отправленное страницей поиска, представляет собой название города, выберите столбец в таблице с именами городов.

  2. Во всплывающем меню, расположенном под первым меню, выберите знак равенства (он уже должен быть выбран).
  3. В третьем всплывающем меню выберите пункт «Переменная формы», если в форме на странице поиска применяется метод POST, или «Параметр URL-адреса» для метода GET.

    Для передачи информации в страницу результатов на странице поиска служит переменная формы или параметр URL-адреса.

  4. В четвертом поле введите имя объекта формы, в который вводится параметр поиска на странице поиска.

    Имя объекта служит в качестве имени переменной формы или параметра URL-адреса. Чтобы получить имя, переключитесь на страницу поиска, выделите объект формы и просмотрите имя объекта в инспекторе свойств.

    Например, предположим, требуется создать набор записей, включающий только командировки в определенную страну. Предположим, в таблице имеется столбец с именем TRIPLOCATION. Также предположим, что в HTML-форме на странице поиска используется метод GET и что форма содержит объект меню с именем «Местоположение» со списком стран. В следующем примере показано, как должен выглядеть раздел «Фильтр».

    Параметры объекта формы

  5. Нажмите кнопку «Тест», введите тестовое значение и нажмите «ОК» для подключения к базе данных и создания экземпляра набора записей (необязательно).

    Тестовое значение моделирует значение, возвращаемое страницей поиска. Нажмите кнопку «ОК», чтобы закрыть тестовый набор записей.

  6. Если с набором данных все в порядке, нажмите кнопку «ОК».

    К странице добавляется серверный сценарий, проверяющий во время выполнения все записи в таблице базы данных. Если указанное в записи поле соответствует условиям SQL-запроса, запись включается в набор записей. Сценарий создает набор записей, содержащий только результаты поиска.

    Следующий шаг — отображение набора записей на странице результатов. Более подробную информацию см. в разделе Отображение результатов поиска.

Создание расширенной страницы результатов

Если страница поиска отправляет на сервер несколько параметров поиска, для страницы результатов необходимо создать SQL-запрос и использовать параметры поиска в SQL-переменных.

Примечание.

Для одного условия поиска определить набор данных можно в простом диалоговом окне «Набор записей». См. раздел Создание основной страницы результатов.

  1. Откройте страницу результатов в Dreamweaver, а затем на панели «Привязки» («Окно» > «Привязки») нажмите кнопку «плюс» (+) и выберите во всплывающем меню «Набор записей», чтобы создать набор записей.
  2. Убедитесь, что открыто расширенное диалоговое окно «Набор записей».

    В расширенном диалоговом окне имеется текстовая область для ввода SQL-оператора. Если открыто простое диалоговое окно, переключитесь на расширенное окно, нажав кнопку «Дополнительно».

  3. Задайте имя набора записей и выберите подключение.

    Необходимо выполнить подключение к базе данных, содержащей данные для поиска.

  4. Введите оператор Select в текстовой области SQL.

    Убедитесь, что оператор включает оператор WHERE с переменными для параметров поиска. В следующем примере переменные называются varLastName и varDept.

    SELECT EMPLOYEEID, FIRSTNAME, LASTNAME, DEPARTMENT, EXTENSION FROM EMPLOYEE ¬ 
    WHERE LASTNAME LIKE 'varLastName' ¬ 
    AND DEPARTMENT LIKE 'varDept'

    Для сокращения объема ввода можно использовать дерево элементов базы данных в нижней части расширенного диалогового окна «Набор записей». Инструкции см. в разделе Определение дополнительного набора записей с помощью создания SQL.

    Справку по синтаксису SQL см. в руководстве по SQL для начинающих: www.adobe.com/go/learn_dw_sqlprimer_ru.

  5. Задайте для SQL-переменных значения параметров поиска. Для этого нажмите кнопку (+) в области «Переменные» и введите имя переменной, значение по умолчанию (значение переменной, которое используется, если не предоставлено значение во время выполнения) и динамическое значение (как правило, объект сервера содержит значение, отправленное браузером, например переменную запроса).

    В следующем примере ASP в HTML-форме на странице поиска применен метод GET, форма содержит текстовые поля с именами LastName и Department.

    Пример ASP

    В ColdFusion динамические значения должны выглядеть следующим образом: #LastName# и #Department#. Предположим, в PHP заданы значения этапа выполнения $_REQUEST[«LastName»] и $_REQUEST[«Department»].

  6. Нажмите кнопку «Тест» для создания экземпляра набора записей с использованием значений переменных по умолчанию (необязательно).

    Значения по умолчанию моделируют значения, возвращаемые страницей поиска. Нажмите кнопку «ОК», чтобы закрыть тестовый набор записей.

  7. Если с набором данных все в порядке, нажмите кнопку «ОК».

    SQL-запрос добавлен к странице.

    Следующий шаг — отображение набора записей на странице результатов.

Отображение результатов поиска

После создания набора записей для результатов поиска необходимо отобразить информацию на странице результатов. Отображение записей можно выполнить с помощью простого перетаскивания на страницу результатов отдельных столбцов из панели «Привязки». Можно добавить навигационные ссылки для перемещения по набору записей или создать повторяющуюся область для отображения нескольких записей на странице. Также можно добавить ссылки на страницу сведений.

Более подробную информацию о способах отображения динамического содержимого на странице, отличного от представления результатов в динамической таблице, см. в разделе Отображение записей баз данных.

  1. Поместите курсор вставки для вставки динамической таблицы на странице результатов и выберите меню «Вставка» > «Объекты данных» > «Динамические данные» > «Динамическая таблица».
  2. Задайте все параметры в диалоговом окне «Динамическая таблица» и выберите набор данных, предназначенный для результатов поиска.
  3. Нажмите кнопку «ОК». В страницу результатов вставляется динамическая таблица, представляющая результаты поиска.

Создание страницы сведений для страницы результатов

Набор страниц поиска и результатов может включать страницу сведений, предназначенную для отображения дополнительной информации о записях на странице результатов. В таком случае страница результатов также служит в качестве основной страницы в наборе основная страница-страница сведений.

Можно создать ссылку, открывающую связанную страницу и передающую в эту страницу существующие параметры. Поведение сервера доступно только при использовании серверной модели ASP.

Перед добавлением к странице поведения сервера «Переход к связанной странице» убедитесь, что страница получает параметры формы или URL-адреса с другой страницы. Функция поведения сервера заключается в передаче этих параметров третьей странице. Например, можно передать параметры поиска, полученные страницей результатов, в другую страницу, освобождая тем самым пользователей от повторного ввода параметров поиска.

Можно также выбрать на странице текст или изображение, которое будет использоваться в качестве ссылки на связанную страницу, или установить курсор на странице без выбора элементов и вставить текст ссылки.

  1. В поле «Переход к связанной странице» нажмите кнопку «Обзор» и выберите файл связанной страницы.

    Если текущая страница отправляет данные самой себе, введите имя файла текущей страницы.

  2. Если параметры для передачи получены непосредственно из HTML-формы при помощи метода GET или содержатся в URL-адресе странице, выберите параметр «Параметры URL-адреса».
  3. Если параметры для передачи получены непосредственно из HTML-формы при помощи метода POST, выберите параметр «Параметры формы».
  4. Нажмите кнопку «ОК».

    При выборе новой ссылки страница передает параметры в связанную страницу в строке запроса.

 Adobe

Получайте помощь быстрее и проще

Новый пользователь?

Adobe MAX 2024

Adobe MAX
— творческая конференция

С 14 по 16 октября очно в Майами-Бич и онлайн

Adobe MAX

Творческая конференция

С 14 по 16 октября очно в Майами-Бич и онлайн

Adobe MAX 2024

Adobe MAX
— творческая конференция

С 14 по 16 октября очно в Майами-Бич и онлайн

Adobe MAX

Творческая конференция

С 14 по 16 октября очно в Майами-Бич и онлайн