2012年4月3日 星期二

Asp.net(C#)的ajax方法(2)--使用Callback的固定方法

承接前文Asp.net(C#)的ajax方法(1)--前言篇



Asp.net裡面有專門連結前後端程式碼的類別──ICallbackEventHandler
.aspx為前端程式,.cs為後端腳本

在宣告使用這個類別之前,後端腳本只能是前端程式的事件劇本,沒有辦法辦到ajax的效果,除非使用UpdatePanel這個內建的控制項,然而一旦包含了ICallbackEventHandler類別後,前端程式可以藉由javascript的選擇來抓到值,然後可以把這個值傳給後端腳本處理,然後再把結果傳回前端,再放進指定的地方,便可以達成非同步的更新效果。

其實ICallbackEventHandler的使用方式非常固定,通常,會在前端.aspx檔的<head></head>之間先註冊兩個javascript函數,函數名字當然可以隨便取,在此我個人通常使用以下的命名:

有注意到這裡"CallServer()"函數並沒有被宣告就直接被拿來用了嗎?別擔心,因為我們要很高級的在behind code的部分把這個javascript函數註冊到前端來!最重要的,當然是Behind code的部分,換到.cs檔繼續code。

public partial class _Default : System.Web.UI.Page, System.Web.UI.ICallbackEventHandler    
//加入類別System.Web.UI.ICallbackEventHandler是callback方法最重要的部分!!!
{
    protected string result;

    //實作方法之一:RaiseCallbackEvent -- 將CallServer()取得的值做處理
    public void RaiseCallbackEvent(string eventArgument){
      /*這塊可以隨意寫作*/
    }

    //實作方法之二:GetCallbackResult -- 將result傳進函數ReceiveServerData()中
    public string GetCallbackResult()
    {
        return result;
    }

    protected void Page_Load(object sender, EventArgs e)
    {
     //--------------------------------------------------------------------------------------------------------------//
        string cbReference = Page.ClientScript.GetCallbackEventReference(this, "arg", "ReceiveServerData", context");
        string callbackScript = "function CallServer(arg, context){" + cbReference + ";}";
        if (!Page.ClientScript.IsClientScriptBlockRegistered(this.GetType(), "CallServer"))
        {
            Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "CallServer", callbackScript, true);
        }
      //--------------------------------------這幾行是固定寫法基本上不會有更改---------------------------------------------//
    }
}

字串cbRefernce是抓取已經在前端註冊的javascript函數ReceiveServerData(arg, context),並將之放進下一個字串callbackscript之中。這個字串存在的目的沒別的,就是要把CallServer(arg, context)這個javascript函數硬是註冊到前端去。

note:
宣告了System.Web.UI.ICallbackEventHandler類別以後,就一定要實做RaiseCallbackEventGetCallbackResult方法。
RaiseCallbackEvent方法,(1)把Page_Load之後從前端CallServer函數抓來的數值做處理,並存進變數result裡面
GetCallbackResult方法則是(2)把變數result傳進前端ReceiveServerData函數裡面
紅框框起來的部分寫法都非常的固定,基本上不會有任何改變的機會,只有RaiseCallbackEvent函數裡面才會放進主要處理運算的部分,在這裡面可以隨你揮灑任意創作。

待續
April 3rd, 2012
shesee@Taipei

沒有留言:

張貼留言