Web Application 開 發 利 器 - WebSnap（三）

Web Application 開 發 利 器 - WebSnap!

第 參 章 、 WebSnap 與 資 料 庫

3-1 基 本 概 念

  WebSnap 對 於 資 料 庫 的 支 援 能 力 比 之 前 的 WebBroker+InternetExpress 增 強 了 很 多 ， 所 以 使 用 WebSnap 來 開 發 資 料 庫 網 頁 程 式 ， 可 以 說 是 一 件 簡 單 且 愉 快 的 事 。 在 我 們 開 始 撰 寫 資 料 庫 程 式 之 前 ， 這 裡 先 讓 我 們 先 了 解 一 下 WebSnap 如 何 串 連 傳 統 資 料 庫 與 網 頁 程 式 。

TDataSetAdapter 元 件

   如 同 我 們 在 第 一 節 所 討 論 的 Adapter 意 義 相 同 ， TDataSetAdapter 就 是 DataSet 的 Adapter 。 我 們 可 以 利 用 TDataSetAdapter 所 提 供 的 函 式 來 操 作 位 於 她 內 部 的 DataSet 元 件 ， 那 麼 為 何 要 這 樣 設 計 呢 ? 為 何 不 直 接 使 用 DataSet 呢 ? 回 答 這 個 問 題 前 讓 我 們 回 想 一 下 上 一 節 的 計 算 機 範 例 ， Adapter 不 只 是 供 DELPHI 程 式 使 用 ， 她 還 輸 出 了 Wrapper 物 件 讓 我 們 可 以 在 Script 中 使 用 她 ， 這 是 DataSet 所 辦 不 到 的 。 你 也 可 以 在 TAdapterPageProducer 中 新 增 一 個 AdapterFieldGroup 或 是 AdapterGrid ， 將 TDataSetAdapter 或 是 單 純 的 Adapter 設 給 她 們 來 顯 示 或 編 修 資 料 ， 她 們 並 不 在 乎 你 設 給 她 的 是 Adapter 還 是 TDataSetAdapter 亦 或 是 你 自 己 所 撰 寫 的 Adapter ， 這 大 大 的 加 強 了 程 式 碼 的 重 用 性 。 例 如 你 可 以 撰 寫 一 個 Adapter 輸 出 某 個 目 錄 下 的 檔 案 列 表 ， 並 使 用 AdapterGrid 來 顯 示 她 們 ， 這 是 不 是 很 棒 呢 ?

TDataSetAdapterField 元 件

   和 TDataSetAdapter 一 樣 ， TDataSetAdapterField 就 是 TField 的 Adapter 。 結 合 TDataSetAdapter 及 TDataSetAdapterField 之 後 就 是 一 個 完 整 的 DataSet Adapter 了 ， 我 們 可 以 利 用 TDataSetAdapter 來 搜 尋 資 料 ， 也 可 以 利 用 TDataSetAdapterField 來 顯 示 與 更 改 資 料 。 接 著 就 讓 我 們 利 用 她 們 來 撰 寫 一 個 可 以 顯 示 資 料 與 一 個 編 修 資 料 的 網 頁 。

3-2 簡 單 的 資 料 庫 網 頁 實 作

我 們 以 上 一 節 的 範 例 為 基 礎 ， 為 她 加 上 一 個 顯 示 資 料 的 網 頁 及 一 個 編 修 資 料 的 網 頁 。 請 你 開 啟 New Items Dialog 並 切 換 到 WebSnap 頁 :

請 在 這 裡 選 擇 WebSnap Data Module ， 這 種 Module 通 常 是 用 來 存 放 Database Components ， 或 是 一 些 輔 助 型 的 非 視 覺 化 元 件 。 執 行 後 我 們 可 以 設 定 這 個 Data Module 的 一 些 特 性 值 :

Caching 選 項 之 前 我 們 就 說 明 過 了 ， 讓 我 們 看 到 Creation 選 項 ， 這 在 Page Module 也 有 出 現 過 ， 只 是 那 時 我 沒 有 解 釋 她 ， 基 本 上 這 個 選 項 會 影 響 Module 的 建 立 行 為 ， 預 設 是 On Demand ， 這 代 表 著 程 式 啟 動 時 並 沒 有 建 立 這 個 Module ， 而 是 等 到 她 被 使 用 到 時 才 會 建 立 這 個 Module 。 那 確 切 的 建 立 時 機 是 何 時 呢 ?

1.                    當 Module 中 的 物 件 被 Activate Module 內 物 件 使 用 到 時 ， 例 如 待 會 我 們 會 在 另 一 個 Module 將 她 設 給 一 個 TDataSetAdapter 元 件 。

2.  當 程 式 明 白 的 使 用 到 (Factroy Method) 建 構 函 式 時 ， 這 裡 的 建 構 函 式 指 的 是 下 面 這 個 :

  function WebDataModule1: TWebDataModule1;
  begin
    Result := TWebDataModule1(
    WebContext.FindModuleClass(TWebDataModule1));
 end;

時 機 1 是 由 Form Load System 幫 我 們 建 立 的 ， 另 一 個 就 類 似 我 們 在 Form1 中 使 用 Form2 內 的 元 件 道 理 一 樣 ， 只 是 Form 中 我 們 用 的 是 全 域 變 數 ， 這 裡 我 們 使 用 的 是 Factroy Method 。 除 了 On Demand 選 項 之 外 ， 另 外 還 有 一 個 Always 選 項 可 供 我 們 選 擇 ， 這 個 選 項 代 表 這 個 Module 會 在 程 式 執 行 時 立 刻 被 建 立 ， 這 可 以 用 在 使 用 率 高 的 Module 上 ， 例 如 Application Module 就 是 使 用 這 個 選 項 ， 因 為 不 管 使 用 者 要 求 的 是 那 一 個 網 頁 或 是 那 一 個 Action ， WebSnap 都 必 須 要 啟 動 Application Module 來 分 發 這 些 要 求 ， 如 果 每 次 都 重 新 建 立 的 話 會 浪 費 掉 一 些 時 間 。 因 此 當 某 個 Module 使 用 的 頻 率 相 當 高 的 話 ， 你 可 以 考 慮 將 她 設 成 Always ， 用 記 憶 體 來 換 取 效 率 。

回 到 範 例 中 ， 請 在 Web Data Module 中 放 入 Database 、 Table 、 Session 這 三 個 元 件 ， 並 設 定 她 們 的 特 性 值 :

然 後 請 在 Table 中 加 入 所 有 的 Fields 。

請 你 將 Module 的 名 稱 改 為 wdmData ， 存 檔 後 我 們 必 須 再 新 增 一 個 Page Module ， 請 選 擇 AdapterPageProducer 作 為 這 個 Page Module 的 PageProducer ， 並 將 Page Name 設 成 Grid ， 接 著 再 加 入 一 個 TDataSetAdapter 到 這 個 Page Module 中

為 了 使 用 wdmData 中 的 Table 元 件 ， 我 們 必 須 要 uses udmData 。

完 成 後 你 就 可 以 回 到 DataSetAdapter 元 件 中 來 設 定 她 的 特 性 值 。

設 定 好 了 之 後 請 雙 按 DataSetAdapter 的 Data 特 性 值 來 加 入 所 有 的 欄 位 。

接 下 來 我 們 還 要 設 計 網 頁 的 顯 示 畫 面 ， 請 開 出 Visual Page Designer 視 窗 ， 新 增 一 個 AdapterForm 元 件 ， 並 在 裡 面 新 增 一 個 AdapterGrid 元 件 。 

然 後 設 定 AdapterGrid.Adapter 特 性 值 為 DataSetAdapter 。

完 成 後 你 就 可 以 看 到 以 下 的 畫 面 了 ， 如 果 資 料 沒 有 顯 示 出 來 的 話 ， 可 能 是 你 的 Table 沒 有 打 開 ， 請 回 到 Data Module 將 Table 打 開 就 可 以 了 。 

嗯 ! 這 個 畫 面 有 點 醜 ， 我 們 可 以 利 用 CSS 來 美 化 她 ， 請 在 AdapterPageProducer 的 Styles 特 性 值 中 輸 入 以 下 的 CSS 命 令 : 

.CustCol
 {
   WIDTH: 70;
 }

.CompanyCol
 {
   WIDTH: 220;
 }

.Addr2Col
 {
   WIDTH: 60;
 }

.CountryCol
 {
   WIDTH: 140;
 }

.CityCol
 {
   WIDTH: 90;
}

輸 入 完 成 後 你 就 能 夠 在 AdapterDisplayField 的 StyleRule 中 選 擇 你 需 要 的 CSS Style 。

在 目 前 的 WebSnap 網 頁 設 計 過 程 中 相 當 依 賴 CSS ， 原 因 是 使 用 CSS 不 但 可 以 簡 化 網 頁 計 ， 也 可 以 使 整 個 網 站 的 風 格 一 致 ， 因 此 找 本 好 的 CSS 書 籍 是 很 重 要 的 。 讓 我 們 回 到 範 例 中 ， 基 本 上 我 們 已 經 完 成 了 一 個 可 以 顯 示 資 料 的 網 頁 了 ， 接 著 我 們 還 要 建 立 一 個 編 修 資 料 的 網 頁 ， 請 新 增 一 個 Page Module ， 一 樣 選 擇 AdapterPageProducer ， 並 將 名 稱 設 為 Edit ， 完 成 後 新 增 一 個 TDataSetAdapter 元 件 到 這 個 Module 中 ， 之 後 就 如 Grid Module 一 樣 連 結 DataModule 並 加 入 所 有 的 欄 位 。 接 著 請 你 開 啟 Visual Page Designer 來 加 入 一 個 AdapterForm 元 件 ， 並 在 裡 面 新 增 一 個 AdapterFieldGroup 元 件 :

然 後 設 定 AdapterFieldGroup.Adapter 特 性 為 DataSetAdapter 。

由 於 我 們 是 要 設 計 編 修 資 料 的 網 頁 ， 因 此 請 設 定 AdapterMode 為 Edit 。

沒 問 題 的 話 你 應 該 可 以 看 到 一 個 編 修 資 料 的 網 頁 。

我 們 還 需 要 一 個 將 編 修 後 的 資 料 存 回 資 料 庫 的 按 紐 ， 請 在 AdapterForm 元 件 上 按 右 鍵 新 增 一 個 AdapterCommandGroup 並 設 定 DisplayComponent 為 AdapterFieldGroup 。

完 成 後 你 會 看 到 一 排 操 作 資 料 庫 的 按 紐

在 這 個 範 例 中 我 們 只 需 要 Apply 按 紐 ， 請 在 AdapterCommandGrou

[1] [2] [3]  下一页

Copyright ＠ 2007-2012 敏韬网(敏而好学，文韬武略--MinTao.Net)（学习笔记） Inc All Rights Reserved.
闵涛 E_mail:admin@mintao.net(欢迎提供学习资源)

鄂公网安备 42011102001154号

站长：MinTao ICP备案号：鄂ICP备11006601号-18