利用 JavaServer Faces 在網頁上顯示動態資訊

本指導教學教您如何設計一個像報紙分類廣告欄一樣的動態網站。這個網站是一個完整的 J2EE Web 應用程式，需要用到 JavaServer Faces (JSF) 元件和「服務資料物件 (SDO)」。這個應用程式採用 JSF 技術來建立動態網頁，可連結至儲存分類廣告資料的資料庫。只要將 JSF 元件拖曳至頁面上，就可建立 JSF Web 應用程式，也就是所謂的 CRUD 應用程式，因為可以建立、讀取、更新及刪除資料庫的記錄。網站使用者可利用這些功能來管理資料庫中的分類廣告。

本指導教學可能需要一些選用的可安裝元件。為了確保您已安裝適當的選用元件，請參閱「系統需求」清單。

完成本指導教學之後，網站使用者不僅可以檢視銷售項目，還可以新增項目、變更項目的詳細資料（例如價格或說明）或搜尋特定類型的項目。雖然這個指導教學站台的設計很簡單，但涉及的原理和技術亦適用於更大和更複雜的網站。

學習目標

這個指導教學分成兩個單元，每個都有它自己的目標。您可以選擇完成這兩個單元或其中任何一個單元。在每個單元內，您都必須完成各個練習，網站才能夠正常運作。

單元 1：建立含資料連線的網頁

本單元教您如何設定資料庫連線及在網頁上顯示資料庫中的資訊。在這個單元中，您將執行下列動作：

將網頁連接到資料庫。
建立可顯示、建立、編輯及刪除資料庫記錄的頁面。
將一個頁面的資料傳到另一頁面

單元 2：新增進階特性

本單元教您以更強大的方式來使用資料庫的資料。在這個單元中，您將執行下列動作：

在網頁中格式化資料庫記錄
新增元件以允許從網頁上將檔案上載到資料庫
自動在頁面之間導覽
自動執行一些資料庫管理作業

當您準備好時，請開始進行「單元 1：建立含資料連線的網頁」。

所需時間

總計：3 小時 30 分鐘

單元 1：2 小時

單元 2：1 小時 30 分鐘

技能等級

中級

讀者

Web 應用程式開發人員、Web 使用者介面設計師

系統需求

完成本指導教學必須先安裝和配置執行時期伺服器。本指導教學已在下列伺服器上測試過：

WebSphere^® Application Server 6.1

如需將 SDO 部署在 WebSphere Application Servers 以外的伺服器的相關資訊，請參閱說明主題：將 SDO 部署在非 WAS 伺服器上。

本指導教學可能需要一些在產品安裝期間未啟用的功能。如果找不到指導教學中說明的使用者介面選項，請確定是否已啟用適當的功能（視窗 > 喜好設定 > 功能）。您需要下列功能才能完成本指導教學：

Java™ Developer
Web 開發者（一般）
XML 開發者
資料庫開發者
企業 Java 開發者
資料

使用本指導教學必須安裝和配置應用程式伺服器。若要驗證是否有伺服器執行時期環境可用，諘按一下視窗 > 喜好設定，展開伺服器，然後按一下已安裝的執行時期。您可以利用這個窗格來新增、移除或編輯已安裝的伺服器執行時期定義。您也可以下載並安裝新伺服器的支援。

必備條件

如果要完成這個指導教學，您應該熟悉下列各項：

基本的 Web 設計概念，例如網站、網頁、瀏覽器及伺服器。
如何建立簡單的靜態網頁。
網頁的元素，例如表格、超鏈結、表單及圖形。
資料庫術語，例如表格、記錄、直欄及欄位。

如果您瞭解下列各項，也會有幫助：

如何使用工作台的視景和視圖。
如何編輯網頁的 HTML 程式碼。

預期結果

Web 應用程式完成之後，首頁的外觀如下圖所示。透過站台範本新增至網頁的網站導覽，連結至頁面來讓您建立新的廣告或檢視所有廣告。下表中顯示的列動作可前往更新頁面，讓您變更特定廣告的相關資訊。