要使用好Ajax.net,就要學會靈活運用Ajax.net所提供的Ajax Control Toolkit。該控制項包提供了很多使用效果很炫的控制項,有了它你能輕鬆打造一個Ajax網站。從本章開始,我們一起來學習怎樣使用Ajax Cotrol Toolkit中的所有控制項。
第一步:建立Ajax Toolkit模板
大家應該有印象,當我們成功安裝了Ajax擴充包之後,VS.net的模板中就多了一個Asp.net Ajax-Enabled Web Site的模板。它是微軟的官方模板,而今天我們就要建立我們自己的Ajax Control Toolkit Web Site模板。
先在這裡下載Ajax Control Toolkit:http://www.codeplex.com/AtlasControlToolkit/Release/ProjectReleases.aspx?ReleaseId=4923
它有兩個版本,建議下載用紅框標示的版本,因為這個版本有源碼,方便大家學習。
下載之後解壓到本地檔案夾。雙擊AjaxControlToolkit.sln檔案,選擇“正常附加元件目”。開啟方案總管之後我們能發現有很多重專案,而我們只需要重建一下TemplateVSI的Dll。產生之後TemplateVSI的bin檔案夾就會多出如下檔案。
雙擊AjaxControlExtender.vsi就可以開始安裝Ajax Control Toolkit模板了。中途遇到提示框選擇重寫名稱即可。
完成之後開啟VS.net 2005,我就能看到AJAX Control Toolkit Web Site模板了。
第二步:添加Ajax Control Toolkit
建立網站後我們還不能在工具列裡看到Ajax.net的工具集,這需要我們自行添加。我們先在工具列添加一個選項卡,命名為Ajax Control Toolkit或其他你喜歡的名字。然後在新的選項卡裡單擊右鍵,點擊“選擇項”-〉點擊“瀏覽”-〉找到你剛才解壓的檔案夾,然後在SampleWebSite的bin檔案夾裡找到AjaxControlToolkit.dll,選擇它,然後一路確定。這樣就能把所有控制項都添加你所添加的選項卡裡了。
第三步:初試Ajax Control Toolkit
到目前為止,Ajax Control Toolkit就部署完畢了,我們可以做一個簡單的Demo看一看效果。
在工具列裡拖出一個Button控制項,一個TextBox控制項和一個Label控制項。然後在Button的Click事件裡寫Label1.Text = TextBox1.Text; 這樣當我們點擊Button後,Label就會顯示TextBox中的內容。
現在我們從Ajax Control Toolkit中拖出一個ConfirmButtonExtender控制項,它的作用是能彈出確認視窗,點擊確認才會繼續執行下一步操作,否則則終止操作。
拖出後我們要設定ConfirmButtonExtender的TargetControlID屬性,它關聯的是控制項ID,告訴ConfirmButtonExtender什麼時候需要彈出確認視窗。我們在該屬性的下拉式功能表中選擇Button1。
然後我們還需要設定確認視窗的提示,該屬性在Button的Extenders欄中,我們找到ContirmText,輸入:你確認嗎?
OK,運行!
結束:
本章主要介紹了怎樣部署Ajax Control Toolkit,並做了一個簡單的例子。雖然該例子即使不使用Ajax Control Toolkit也能簡單實現,但我只想告訴大家,使用Ajax Control Toolkit是多麼的方便,以後將會陸續介紹其他更複雜,效果更炫的控制項,敬請繼續關注。^-^