Ajax.Net之入階篇

前兩天寫了那篇Ajax.Net的體會，有朋友問題這個東東應該怎麼配置，代碼應該怎麼寫。其實在它的example裡面有一個QuickGuide.txt說的比較清楚，但是我還是這裡來根據我的親身體驗來一步一步的示範一下。我的開發環境是Windows XP SP2，VS.Net 2005 Beta2。

首先到http://ajax.schwarz-interactive.de/download/AjaxSample.zip 下載Demo包，或者在這兒http://ajax.schwarz-interactive.de/download/ajax.zip 直接下載ajax.dll。

1、在VS.Net中建立一個Web Project，引用ajax.dll。
2、修改web.config，在裡面增加
<configuration>
  <system.web>
    <httpHandlers>
    <add verb="POST,GET" path="ajax/*.ashx" type="Ajax.PageHandlerFactory, Ajax" />
    </httpHandlers> 
    ...
  <system.web>
</configuration>
這是利用HttpHandlers來動態產生Javascript用的。

3、我們建立一個實現商務邏輯的類，並在裡面增加一個方法。
public class class1
{
 [Ajax.AjaxMethod()]
 public int ServerSideAdd(int firstNumber, int secondNumber)
 {
  return firstNumber + secondNumber;
 }
}
4、在default.aspx.cs的Page_Load事件中增加一行
    protected void Page_Load(object sender, EventArgs e)
    {
        Ajax.Utility.RegisterTypeForAjax(typeof(class1));
    }
5、在default.aspx分頁檔中，寫上這如下Javascript代碼
<script>
function f1(a,b)
{
  alert(class1.ServerSideAdd(a,b).value);
}
</script>
意思是調用class1的ServerSiderAdd函數，並顯示出來
6、在頁面中再增加一個連結來觸發這個函數
<a href="javascript:f1(2,3);">calculate</a><br>
好，現在編譯運行一下看看。當你點擊頁面上的“calculate”連結時，是不是如你所願的出現了5？
而這一切都是後台計算，並且瀏覽器頁面沒有重新整理。

後記：
如果所有步驟做完，你會在產生頁面的原始碼中發現如下代碼：
<script type="text/javascript" src="/WebSite1/csharpwrapper/common.ashx"></script>
<script type="text/javascript" src="/WebSite1/csharpwrapper/class1,App_Code.94psvga2.ashx"></script>
你可以把這兩個script下載並開啟看看，Ajax.Net到底在裡面做了些什麼，而有如此神奇的功能。