目錄
Ajax是異步Javascript和XML(Asynchronous JavaScript and XML)的英文縮寫。"Ajax"這個名詞的發(fā)明人是Jesse James Garrett,而大力推廣并且使Ajax技術(shù)炙手可熱的是Google。Ajax的核心理念在于使用XMLHttpRequest對象發(fā)送異步請求。
場景1:數(shù)據(jù)驗證
場景2:按需取數(shù)據(jù)
場景3:自動更新頁面
目前該產(chǎn)品被加入到WebWork中,開源(Apache)??梢栽贘avascript代碼中直接調(diào)用java方法的應(yīng)用框架,可以把Javascript中的請求調(diào)用轉(zhuǎn)遞到j(luò)ava方法中并將執(zhí)行結(jié)果返回給Javascript。
AjaxPro是首家支持以各種方式通過javascript訪問服務(wù)端.net的免費庫,類似于SAJAX。它能把Javascript請求發(fā)送到.NET方法,服務(wù)端傳回給Javascript,甚至包括串行化自定義類。其主要特點如下:
可以在Javascript中訪問Session和Application數(shù)據(jù);
緩存查詢結(jié)果
免費使用源代碼
所有類支持Javascript客戶端返回數(shù)據(jù),可以在Javascript中使用DataSet
使用HtmlControls組件訪問和返回數(shù)據(jù)
頁面無需重載,用事件代理(數(shù)據(jù)訪問層)
因為只提供一個調(diào)用接口方法,所以服務(wù)端CPU占用非常少。
Magicajax以最簡單的方式將Ajax功能整合到頁面中,不需要修改ASP.NET控件,也不需要編寫新的控件,更不需要撰寫JAVASCRIPT,它有如下的特性:
應(yīng)用配置簡單,易于上手;
只用一個AJAXPANEL就實現(xiàn)Ajax功能,只要把需要無刷的控件放進AJAXPANEL就可以了。
Ajax功能和普通的POSTBACK可以共存于一個WEBFORM,MAGICAJAX處理模塊只處理包含在AJAXPANEL中的控件的CALLBACK動作。
VIEWSTATE的內(nèi)容對于POSTBACK和CALLBACK來說,都是可見的,因此,無論是CALLBACK產(chǎn)生的VIEWSTATE,還是POSTBACK產(chǎn)生的,都是可見的;
提供一個類似POSTBACK的CALLBACK的事件模型
支持IE和Firefox
和傳統(tǒng)的Ajax技術(shù)相比,Anthem.NET有以下優(yōu)點:
不需要任何技術(shù)升級,以前不會使用Ajax技術(shù)的人員,按照以往的編程方式就可以實現(xiàn)異步交互;
支持asp.net 1.1和asp.net 2.0
本文檔將使用AjaxPro.Net框架實現(xiàn)Ajax功能:在客戶端異步調(diào)用服務(wù)端方法。AjaxPro.Net是一個優(yōu)秀的.net環(huán)境下的Ajax框架,用法很簡單,可以查閱相關(guān)資料,本文檔以一個簡單的實例講述使用AjaxPro的幾個關(guān)鍵點,本例實現(xiàn)一個簡單的功能,服務(wù)器端將頁面中輸入的數(shù)字加1后的結(jié)果返回給客戶端(注意,必須有AjaxPro包,即AjaxPro.dll文件,可以在VSS上下載)。
2.1.1用VS打開項目,在其資源管理器中,右擊引用,左擊"添加引用",如圖1_1所示
圖1-1
2.1.2出現(xiàn)如圖1_2所示的對話框,點擊瀏覽,找到AjaxPro.dll文件所在的位置,雙擊AjaxPro.dll,然后點擊確定。
圖1-2
2.1.3在資源管理器的引用文件夾下,就可以看到AjaxPro了,說明添加引用成功,如圖1_3所示。
圖1-3
這一步的作用是保證客戶端向"ajaxpro/*.ashx"的請求(POST和GET)都被AjaxPro.AjaxHandlerFactory攔截。
打開web.config文件,在<configuration><system.web>后添加以下代碼,
<httpHandlers> <add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro"/> </httpHandlers> |
如圖2_1所示。
圖2-1
2.3.1打開后臺代碼,在Page_Load方法體內(nèi)加上如下代碼,
AjaxPro.Utility.RegisterTypeForAjax(typeof(所在類的類名));
如圖3-1所示。
圖3-1
其作用是向客戶端輸出下面的代碼:
<script type="text/javascript" src="/ch33/ajaxpro/core.ashx"></script> <script type="text/javascript" src="/ch33/ajaxpro/ch33.Verify,ch33.ashx"></script> |
2.3.2、添加數(shù)字加一的方法,首先在方法前加[AjaxPro.AjaxMethod],然后像寫C#方法一樣寫方法,如圖3-2
圖3-2
注意:需要加上[Ajax.AjaxMethod]標(biāo)識,這樣才能夠被客戶端訪問
在前臺添加JS腳本,調(diào)用服務(wù)器端方法,如圖4-1所示(Try.AjaxTest.Add(num),Try為頁面類,即AjaxTest類所在的命名空間,這里是Try;而AjaxTest即為類名,Add為方法名)
圖4-1
按以上四個步驟,就可以實現(xiàn)預(yù)期的效果,如圖5-1所示。
圖5-1