森老頭的瘋狂世界

本文使用 PageMethods 的方式來實現非同步機制，也就是說使用 JavaScript 呼叫後端程式碼的函式(C#/VB)，使其不會刷新網頁，將結果更新於網頁上。

在實作過程中有幾點注意事項：
1. 頁面上加入一個 ScriptManager 或 ToolkitScriptManager 控制項，將 EnablePageMethods 屬性設為 true。
2. 方法必需要加上 [System.Web.Services.WebMethod]屬性。
3. 方法必需宣告為靜態方法(static)。
4. 使用 PageMethods 物件呼叫伺服端函式。ex：PageMethods.<Server MethodName>(param...,success, fail)
5. PageMethods 預設行為模式為：使用 HTTP POST 命令呼叫，而且回應資訊將序列化為 JSON 傳回。

 Web 畫面 (使用 html 表單)

後端程式碼(C#)
[System.Web.Services.WebMethod] public static string GetServerTime(string format) { return DateTime.Now.ToString(format); }

JavaScript
<script src="jquery-1.2.6.js" type="text/javascript"></script> <script type="text/javascript"> $(function() { $("#Button1").click(function() { //呼叫伺服端函式，參數1:要傳給伺服端 // 2:成功要執行的javascript function // 3:失敗要執行的javascript function PageMethods.GetServerTime("yyyy/MM/dd HH:mm:ss", onSuccess, onError); }); }); // 成功時更新文字方塊 function onSuccess(receiveData) { $("#TextBox1").val(receiveData); } // 失敗時彈出失敗訊息 function onError(error) { if (error != null) alert(error.get_message()); } </script>

PageMethods 運作方式
當 ScriptManager 或 ToolkitScriptManager 控制項啟用了 EnablePageMethods="true" 後，會去尋找此頁面是否有標示 [System.Web.Services.WebMethod] 的靜態函式(static method),若有的話會在網頁 Render 時產生 Javascript ，可透過此 JavaScript 與伺服端進行溝通。

可查看網頁原始檔就會發現。
<script type="text/javascript"> //<![CDATA[ var PageMethods = function() { PageMethods.initializeBase(this); this._timeout = 0; this._userContext = null; this._succeeded = null; this._failed = null; } PageMethods.prototype = { _get_path:function() { var p = this.get_path(); if (p) return p; else return PageMethods._staticInstance.get_path();}, GetServerTime:function(format,succeededCallback, failedCallback, userContext) { /// <param name="format" type="String">System.String</param> /// <param name="succeededCallback" type="Function" optional="true" mayBeNull="true"></param> /// <param name="failedCallback" type="Function" optional="true" mayBeNull="true"></param> /// <param name="userContext" optional="true" mayBeNull="true"></param> return this._invoke(this._get_path(), 'GetServerTime',false,{format:format},succeededCallback,failedCallback,userContext); }} …… …… …… </script>