摘要:AJAX - 驚豔酷炫效果製作者 ASP.NET AJAX Control Toolkit
自從 2005年 9 月 Microsoft® ASP.NET 團隊推出研發代碼（Codename）為 Atlas（後來正名為 ASP.NET AJAX）的 AJAX 開發架構（Framework）之後，迄今，雖然尚未推出正式版本（目前為 RC 版本），但是已經有許許多多的網頁開發人員或網站正在使用 ASP.NET AJAX 這一個新穎的技術來提升網頁的互動性、回應速度與使用便利性。
為了讓更多採用微軟技術的網頁開發人員能夠更快速地建構具備豐富型用戶端 AJAX 功能的網頁應用程式，微軟工程師與熱心的社群（Community）人士，發揮無比的創意與無私的精神成就了 ASP.NET AJAX Control Toolkit（控制項工具包）。透過這個工具包內建的控制項與擴充器（Extender），網頁開發人員得以輕鬆且快速地替網頁注入令人驚豔的酷炫效果。ASP.NET AJAX Control Toolkit 主要用途如下所列：
r 提供現成元件給網站開發人員使用，讓自己的網頁應用程式更加耀眼奪目。
r 提供優質的程式碼，讓希望自行撰寫用戶端程式碼的人觀摩學習。
r 讓功力深厚的指令碼開發人員（Script Developer）擁有盡情揮灑創意的空間。
接下來，我們展示兩個實際的網頁範例，以期大家對 ASP.NET AJAX Control Toolkit 超強功能有更深刻的體驗。
圖表1
圖表 1 所示的非同步網頁是我們所撰寫的第一個網頁範例，重點在於，其中用於選取客戶名稱與訂單號碼的下拉選單都是利用「連動式階層下拉選單（CascadingDropDown）」這一個 Control Toolkit 所製作出來的。第一個下拉選單用於選取客戶名稱，第二個下拉選單將會列出您於第一個下拉選單中所選取之客戶的訂單號碼以便讓您選取之。
特別值得注意的是，當客戶名稱資料尚未取得之前，會看到第一個下拉選單顯示「讀取客戶資料中...」的訊息，此時使用者無法選取該下拉選單中的選項，等到該選項資料完全被下載到用戶端並填入下拉選單之後，該下拉選單就會顯示「請選擇客戶名稱」訊息，告知使用者可以從中選取客戶名稱。
在您從第一個下拉選單選取了某位客戶名稱之後，用於選取訂單編號的下拉選單將會顯示「讀取訂單資料中...」的訊息，此時使用者無法選取該下拉選單中的選項，等到該選項資料完全被下載到用戶端並填入下拉選單之後，該下拉選單就會顯示「請選擇訂單編號」訊息，告知使用者可以從中選取訂單編號。在您從第二個下拉選單選取所需的訂單編號之後，就會查詢出客戶之該筆訂單的訂貨明細資料。
圖表2
圖表3
圖表2與圖表3所示的網頁示範如何使用 ASP.NET AJAX Control Toolkit 的停駐選單（HoverMenu）。值得注意的是，該網頁的「標題」（Header）、「資料列」以及「註腳」（Footer）區域會分別擁有不同的背景圖片。在頁次導覽方面，我們除了提供「第一頁」、「上一頁」、「下一頁」與「最後頁」按鈕來方便您移至特定的頁次之外，更提供了一個下拉選單來讓您快速移至特定的頁次。此外，我們會在右下角顯示目前所在頁次與總頁數的資訊，以避免您不知身在何處。
欲根據某個欄位來排序資料，只需使用滑鼠左鍵按一下欄位名稱，此時資料便會根據該欄位的資料內容由小至大遞增排序，並且還會在欄位名稱旁邊出現一個向上箭頭圖示
，並顯示排序後的第 1 頁資料內容。
此外，將滑鼠移至某一列產品資料時，滑鼠指標所停駐的資料列會呈現不同的背景顏色。更重要的是，欲瀏覽某一項產品的照片時，只需將滑鼠指標移至該產品資料的「名稱」儲存格上，產品相片會立即顯示於右側。這樣便利且華麗的操作介面，肯定讓使用者愛不釋手。
從本文可以瞭解，結合 ASP.NET 2.0 與 ASP.NET AJAX 的設計技巧並適時注入各式各樣的 ASP.NET AJAX Control Toolkit，將使您的網頁功能強大並且酷炫無比，並深深擄獲使用者的心。有了 ASP.NET AJAX Control Toolkit 這樣的好幫手，或許能夠限制您的，就是自己的創意與想像力吧！
本文節錄並改編自章立民研究室正在撰寫之「ASP.NET AJAX 非同步網頁開發秘訣」一書，諸位讀者敬請期待。
章立民研究室
「SQL Server 2005 完全實戰」
「Visual Basic 2005 程式開發與介面設計秘訣」
「Visual C# 2005 程式開發與介面設計秘訣」
「Visual Basic 2005 檔案 IO 與資料存取秘訣」
「Visual C# 2005 檔案 IO 與資料存取秘訣」