在這個指導教學中,您將利用 JavaServer Faces 程式設計模型來建立簡式應用程式。藉著利用 Java 類別來建立 Faces 用戶端資料模型,以及利用拖放功能將控制項新增至頁面中,我們便能夠快速開發進階應用程式。我們將建置一個 JavaServer Pages (JSP) 頁面,其中包含四個元件:三個 Faces 用戶端元件(資料格線、樹狀結構和圖形),以及一個 Faces 元件(標籤畫面)。您將建置的應用程式是一個範例股票投資組合管理網站,它將用各種方法來追蹤用戶端的個人持股。
所需時間
如果要完成這個指導教學,您需要大約 1 小時 45 分鐘。
不過,如果您想要的話,您可以單獨完成其中任何一個模組。
如果您決定要在操作指導教學時探索 Faces 用戶端元件其他項目,您可能需要花較長的時間來完成。
必備條件
如果要從頭到尾完成這個指導教學,您應該熟悉下列主題:
- 基本 Web 設計概念,如網站、網頁、瀏覽器和伺服器
- 如何建立簡單靜態網頁
- 網頁元件,如表格、超鏈結、表單和影像
- 資料庫詞彙,如表格、記錄、直欄和欄位
如果您瞭解這些主題,也會有所幫助:
- 如何使用工作台環境的視景和視圖
- JavaServer Pages (JSP) 和 JavaServer Faces 技術背後的概念
學習目標
這個指導教學分成三個模組。
您可以選擇依照任何次序來完成所有模組或其中任何一個模組。
每個模組都包含多個練習,您必須依序完成這些練習。
模組 1:瞭解 Faces 用戶端元件說明 Faces 用戶端元件,以及如何在 Web 應用程式中最妥善運用不同的元件。在這個模組中,您將執行下列動作:
- 瞭解 Faces 用戶端
- 區別三個元件:資料格線、樹狀結構和圖形
- 演練使用多個 Faces 用戶端元件的範例應用程式
模組 2:使用資料格線說明如何利用資料格線 Faces 用戶端元件來使用資料用戶端,且不需要重新整理頁面。
在這個模組中,您將執行下列動作:
- 檢視伺服器端和用戶端資料
- 插入和配置資料格線元件
- 將元件連結至用戶端資料
- 自訂直欄
- 實作用戶端處理常式
- 刪改資料結構
- 在伺服器中測試 JSP 檔
模組 3:新增樹狀結構、標籤畫面和圖形元件說明如何在樹狀結構、標籤畫面和圖形元件中顯示資料。
在這個模組中,您將執行下列動作:
- 利用標籤畫面 Faces 元件來補充 Faces 用戶端元件,以提供多個資料視圖
- 插入和配置樹狀結構 Faces 用戶端元件來顯示階層式資料
- 插入和配置圖形 Faces 用戶端元件來利用圓餅圖、圖表或線條圖顯示資料
- 在伺服器中測試 JSP 檔