Ajax和JSF是當今互聯網上最流行的技術，Ajax被稱作 Web 2.0 的基石。不幸的是，創建 AJax 應用程序並不容易，尤其是當您需要與其他框架融合時，例如 JavaServer™ Framework (JSF)。幸運的是，IBM Rational Application Developer V7 為 JSF 組件提供了 Ajax 功能，這一功能使得這樣的任務變得簡單。本文介紹了如何在 IBM Rational Application Developer V7 中使用 Ajax和JSF 以降低任務的難度，並通過一個例子示范如何在現存的應用程序中增加 AJax 支持。
AJax 的優勢和缺點
雖然不是什麼革新性創新，Ajax 技術在近兩年變得非常流行。大量主要 Web 站點（例如 Google、Yahoo!、 Amazon 和 Netflix）使用這一技術來改善它們網站用戶的訪問體驗。事實上，改進用戶體驗正是 AJax 要做的。
在過去十年的 Web 應用程序開發中，用戶與浏覽器間和浏覽器與服務器間的交互是明確界定及顯而易見的：用戶在浏覽器內浏覽網頁，執行操作（從上下文菜單中選擇內容，或者選擇一些復選框），之後通過點擊鏈接或提交按鈕指導浏覽器與服務器通信。浏覽器給服務器發送請求並傳遞用戶輸入。服務器處理請求並返回響應，返回的可能是更新的頁面或是相同的頁面，總之進行了更新。
這樣的 Web 應用程序現在被稱為 Web 1.0。 從用戶體驗的觀點來看，它們具有兩條缺陷：
◆浏覽器和服務器的交互只能由頁面中有限的控件發起——常常是鏈接和按鈕。這樣就不能在用戶選擇了復選框（check box）或在組合框（combo box）後迅速通知服務器。
◆浏覽器和服務器的這種交互所造成的後果就是需要更新整個浏覽器窗口。這種情況通常很慢，頁面更新往往需要用戶等待很長時間。更壞的是，當同一頁面被重新加載或重新刷新時，經常會在浏覽器窗口中閃爍。
新一代被稱為 Web 2.0 的 Web 應用程序通過利用 Ajax 技術彌補了這些缺點（也作AJax，即 Asynchronous Javascript and XML，異步的 JavaScript 與 XML）。在 AJax 中，浏覽器和服務器的交互發生在後台，用戶將不會覺察。而且它比普通的“浏覽器 - 服務器”交互更具針對性，僅僅需要將頁面的子集發送給服務器，並且服務器僅僅返回所需更新的子集頁面。這種方式所帶來的結果就是，浏覽器和服務器間的通信可被任何事件初始化，例如在組合框或復選框中進行選擇，或鼠標指針停留事件等。這樣帶來了很大好處：
◆通信更加迅速，因為傳遞的數據更少。
◆用戶停留在同一頁面，因為不再需要過多的頁面間導航。
◆重新加載的頁面不會閃爍，因為僅僅是頁面中的一小部分依據 AJax 請求更新。
AJax 背後的想法十分簡單：在浏覽器中監聽事件，給服務器發送後台請求，當服務器響應時更新頁面的一部分。但是實現過程是非常復雜的。它需要 JavaScript™，客戶端－服務端通信協議，和服務端代碼的深層知識。不同浏覽器版本間的區別使得開發與調試更加困難。但是，IBM® Rational® Application Developer Version 7 提供了所有開發 AJax Web 應用程序所需的工具，而 不必 實現所有底層細節。
Rational Application Developer V7 提供了：
◆擴展的 JSF 允許在 JavaServer™ Framework (JSF)中處理 AJax 請求
◆一個可以在所有最新版本的主流浏覽器中初始化 AJax 請求，並在服務器端響應僅對部分頁面進行更新的 JavaScript™ 程序庫
Rational Application Developer V7中 AJax和JSF 實現的技術細節超出了本文的范圍，但是讓我們來看看您如何使用這些技術。
如何用JSF組件應用AJax
為 JSF 頁面增加 AJax 需要四個步驟：
1. 識別由 Ajax 請求更新的頁面區域。 在 Rational Application Developer V7中， 您可以在幾乎任何面板組件的內容中使用 AJax。面板包括了從簡單的容器，例如 <h:panelGroup> 和 <h:panelGrid>，到特性豐富的面板，例如菜單 (<hx:panelMenu>) 和對話框(<hx:panelDialog>)。
2. 選擇所使用的 Ajax 請求類型。 Rational Application Developer V7 JSF 庫支持三種 AJax 請求：
◆對於同一頁面的 GET 請求 (<hx:AJaxRefreshRequest>)
◆對於同一頁面的 POST 請求 (<hx:AJaxSubmitRequest>)
◆對其他頁面的 GET 請求 (<hx:AJaxExternalRequest>)
3. 應用 AJax 請求配置傳遞給服務器的參數。
◆對於 GET 請求，您可以傳遞頁面中不同輸入欄的值。
◆對於 POST 請求， 提交全部表格。
4. 識別初始化 AJax 請求的事件。 它可以是任何的客戶端 JavaScript 事件，例如按鈕的 onclick ， 輸入欄的 onblur， 或復選框的 onchange 。
