Технологія WebSnap (стр. 3 из 3)
Малюнок 23
Залишився останній крок: зберегти модуль під ім'ям LoginPage, перейти в модуль PageProducerPage1 (головну сторінку) вказати у властивості LoginPage компоненту EndUserSessionAdapter1 значення LoginPage
Тепер можна побудувати проект і перенести на Web-сервер файли Unit1.html, Unit2. html Unit3.html, Project1. dll. Подивимося, що з'явилося – вверху сторінки з'явилося посилання з текстом Вход (мал. 24).
Малюнок 24
Оберімо Входабо Страница просмотра/редактирования данных, введемо в поля Имя польователя і Пароль (мал. 25) ім'я Ellen і пароль admin, як наступну сторінку указуємо Страница просмотра/редактирования данных, натискаємо кнопку Вход.
Малюнок 25
Малюнок 26
Приклад 5. Робота з базою даних за допомогою WebSnap-сервера
БД надають можливість зберігати і обробляти великі обсяги інформації. Можливість роботи з БД на сьогодні є просто необхідним атрибутом будь-якого засобу розробки Web-прикладень. Технологія WebSnapнадає достатньо продумані і зручні засоби публікації вмісту БД, а в поєднанні з СКБД Interbase дозволяє будувати прикладення для роботи з БД, що задовольняють запитам найвередливіших користувачів. Спроектуємо сторінку для відображення вмісту таблиці biolifeдемонстраційної БД Interbase 7.5 C:\Program Files\Common Files\ Borland Shared\Data\dbdemos.gdb.
Вказівки по налагодженню бази даних
Для роботи з БД необхідно встановити на комп'ютер InterBase Server 7.5 і за допомогою, наприклад, програми IBExpert зареєструвати БД C:\Program Files\ Common Files\ Borland Shared\Data\dbdemos.gdb під псевдонімом IBDBDemos (мал. 27).
Малюнок 27
Створення WebSnap-сервера
Для розташування компонентів зв'язку з БД в проект необхідно вставити модуль даних WebDataModuleза допомогою майстра. Виконаємо команду File | New | Other | WebSnap | WebSnap Data Module. У діалозі, що з'явився (мал. 28), вкажемо спосіб створення модуля Always і спосіб його знищення Cache Instance.
Малюнок 28
Після цього розташуймо в модулі компоненти: IBDatabase, IBTransaction, IBDataSetі зв'яжемо їх з БД IBDBDemosі таблицею biolife, яка містить графічні поля, поля коментарів, числові і текстові поля, які можна публікувати і редагувати з використанням WebSnap (мал. 29).
Малюнок 29
В одержаний модуль додамо DataSetAdapterі зв'яжемо його з джерелом даних, призначивши властивості DataSetзначення IBDataSet1. Далі двічі клацнемо мишею по компоненту DataSetAdapter1 і за допомогою команди Add All Fields контекстного меню встановимо список полів, що відображаються (мал.. 30).
Малюнок 30
Для публікації даних таблиці БД найзручніше використовувати компонент-продюсер AdapterPageProducer. Додамо в модуль сторінки PageProducerPage2 компонент AdapterPageProducer. Після цього подвійним клацанням миші по компоненту AdapterPageProducer, викличемо редактора для побудови HTML-сторінки. Натиснемо в редакторі кнопку New Item і додамо Web-компонент AdapterForm1, далі на AdapterForm1 тією ж кнопкою додамо компонент AdapterGrid1 і встановимо його властивості:
· Adapterв значення BiolifeWebDataModule->DataSetAdapter1 (для зв'язку сторінки з джерелом даних потрібно не забути додати в початковий код сторінки посилання #include "Unit4.h" на модуль даних WebDataModule);
· Adapter Modeв значення Edit (режим редагування);
· Командою AddAllColumnsконтекстного меню визначимо список полів, що відображаються (тут також можна змінити найменування полів на національні за допомогою їх властивостей Caption).
Оскільки WebSnap використовується для побудови stateless-серверів, що працюють з БД, слід вказати первинний ключ, що дозволяє набору даних активізувати навігацію по таблиці і маніпуляцію даними по запиту клієнта. WebSnap виконає все це автоматично після завдання первинного ключа. Використовуємо як первинний ключ поле Species No. Спочатку слід вибрати поле в Object Treeviewдля BiolifeWebDataModule(мал. 3.31).
Малюнок 31
Потім необхідно модифікувати властивість ProviderFlags в інспекторі об'єктів, встановивши pfInKey в значення true, щоб вказати, що Species No є первинним ключем для даного набору даних. Тоді сторінка буде доповнена «мережею», що відображує поля записів таблиці (мал. 32).
Малюнок 32
Наступним Web-компонентом, який ми додамо на AdapterGrid1, буде компонент AdapterCommandColumn1, у якому відображатиметься кнопка CmdEditRow (Детали) керування поточним записом таблиці (мал. 33). Для кнопки CmdEditRowвстановимо властивість PageNameв значення DetailPage, яка ще не створена і в якій буде надана можливість редагування таблиці БД.
Для редагування даних поточного запису таблиці БД створимо ще одну Web-сторінку. Виконаємо команду File | New | Other | WebSnap | WebSnap Page Module.
У діалозі параметрів сторінки слід змінити тип Type продюсера з PageProducer на AdapterPageProducer, а також встановити прапорець LoginRequired, оскільки за умовчанням сторінка для редагування даних повинна бути доступна не всім користувачами (мал. 34).
Малюнок 33
Малюнок 34
Малюнок 35
Посилання на джерело даних для нього встановимо за допомогою оператора #include “Unit4.h”. Натиснемо в редакторі кнопку New Item і додамо Web-компонент AdapterForm1, далі на AdapterForm1 тією ж кнопкою додамо компонент AdapterFieldGroup1 і встановимо його властивості:
AdapterFieldGroup1->Adapter = BiolifeWebDataModule->DataSetAdapter1
AdapterFieldGroup1->Adapter->Mode = Edit
На AdapterForm1 додамо компонент AdapterCommandGroup1, у якому відображатимуться кнопки навігації по таблиці, і який забезпечить редагування даних. Його властивість DisplayComponentслід встановити в значення AdapterFieldGroup1. Командою AddCommandsконтекстного меню можна задати список кнопок. Тоді сторінка буде доповнена кнопками керування таблицею (мал. 36).
Малюнок 3.36
Побудуємо проект, опублікуємо на Web-сервері файли: project1.dll, unit1.html, unit2. html, unit3.html, unit4.html, unit5.html, запустимо браузер і вкажемо на адресу http://localhost/ scripts/project1.dll.
Результат роботи WebSnap-прикладення показаний на мал. 37.
Малюнок 37 а)
Малюнок 37 б)