使用 Anthem.NET 的常見回調(Callback)處理方式小結

在 Anthem.NET 中,經過 XmlHttp 或 XmlHttpRequest 組件對服務器端所做的一次無刷新調用(一般是異步模式),稱爲一個回調(Callback)。

本文內容是對 Anthem.NET 框架自帶範例代碼的整理和概括,着重小結一下在使用 Anthem.NET 進行 Ajax 開發的時候所涉及的調用流程控制相關的內容。至於控件的使用,由於邏輯簡單,這裏不作敘述。

在本文後,計劃寫一篇文章對調用流程及其編程時的可控制點作比較完備的概括。javascript

1、普通的調用

<%@ Register TagPrefix="anthem" Namespace="Anthem" Assembly="Anthem" %>
<anthem:Button id="button" runat="server" Text="Click Me!" />
<anthem:Label id="label" runat="server" />
<script runat="server">
void button_Click(object sender, EventArgs e) {
    label.Text = DateTime.Now.ToString();
    label.UpdateAfterCallBack = true;
}
</script>
html

 

2、在回調先後添加自定義客戶端函數的執行邏輯

幾個經常使用的屬性:

PreCallBackFunction:用於定義回調前執行的函數,一般能夠在這裏加入確認的判斷。
                     在這個函數裏 return false 將會取消回調。

PostCallBackFunction:   回調後執行的函數。
TextDuringCallBack:    用於定義回調過程當中控件顯示的提示信息(一般是提示等待的文字)
EnabledDuringCallBack: 在回調過程當中,控件是否禁用。
CallBackCancelledFunction: 若是回調被取消,則會調用這個函數。

代碼例子:

<anthem:Button id="button1" runat="server" Text="Click Me!" TextDuringCallBack="Working..." EnabledDuringCallBack="false" PreCallBackFunction="button1_PreCallBack" PostCallBackFunction="button1_PostCallBack" CallBackCancelledFunction="button1_CallBackCancelled" />

<script language="javascript" type="text/javascript">
// 回調以前,可在這裏取消回調
function button1_PreCallBack(button) {
    if (!confirm('Are you sure you want to perform this call back?')) {
        return false;
    }
    document.getElementById('button2').disabled = true;
}
java


// 回調完成後
function button1_PostCallBack(button) {
    document.getElementById('button2').disabled = false;
}

// 取消回調後
function button1_CallBackCancelled(button) {
    alert('Your call back was cancelled!');
}

</script>

注意以上這些客戶端處理函數中,均可以傳遞 control 自己做爲參數,所以在必要的狀況下這些函數是能夠被重用的。(好比對一組相似的控件的回發事件進行處理)


3、調用服務器頁面的方法

服務器端須要作的事情:

[Anthem.Method]
public int Add(int a, int b) {
    return a + b;
}

void Page_Load() {
    Anthem.Manager.Register(this);
}

客戶端:
<input id="a" size="3" value="1">
<input id="b" size="3" value="2">
<button onclick="DoAdd(); return false;" type="button">Add</button>
<input id="c" size="6">


// 參數的含義依次是:
//     服務器方法的名字,
//     方法的參數(以 js 數組形式傳遞),
//     服務器端方法返回結果時調用的回調函數(由於是異步模式)。
Anthem_InvokePageMethod(
    'Add',
    [document.getElementById('a').value, document.getElementById('b').value],
    function(result) {
        document.getElementById('c').value = result.value;
    }
);


調用後,在回調函數的參數中獲得的 result 變量,是一個包含 value 和 error 兩個屬性的對象。若是在服務器端發生錯誤,則 value 爲 null, 而 error 中包含錯誤數據。


4、如何處理回調時可能發生的異常

在頁面中定義 Anthem_Error js 函數,則可處理全部回調時的未處理異常。
編程

<script type="text/javascript">
function Anthem_Error(result) {
    alert('Anthem_Error was invoked with the following error message: ' + 
        result.error);
}
</script>

異常也能夠在服務器端處理。只要定義下列名稱的方法:

void Page_Error()
{
    Anthem.Manager.AddScriptForClientSideEval("window.location = '
http://anthem-dot-net.sf.net/'");
}

在服務器端處理有一些額外的好處,主要是能夠將異常信息記錄到日誌.


5、頁面跳轉

在 Callback 的處理中,不能用 Response.Redirect 來處理頁面跳轉,由於這些函數是經過 js 的無刷新來調用的。代替的辦法是用 Anthem.Manager 回傳一段 js 給客戶端去用 eval 的方式執行,從而達到頁面跳轉的效果(推而廣之,這個 eval 的功能固然不限於跳轉頁面,能夠幹不少其餘的事情)。

代碼示例:

Anthem.Manager.AddScriptForClientSideEval("window.location = 'http://anthem-dot-net.sourceforge.net/';");


6、幾個全局級別的客戶端回調函數

咱們能夠在客戶端定義幾個特殊名字的函數,以供 Anthem 在每一次回調的先後調用。這些函數包括:
Anthem_PreCallBack(),
Anthem_CallBackCancelled(),
Anthem_PostCallBack(),

除此以外還包括前面說到的 Anthem_Error() 等。

這裏典型的一個應用場景是,在每次回調開始後,咱們在 Anthem_PreCallBack() 中建立一個「loading」信息的層,而後在取消(Anthem_CallBackCancelled) 或成功回調後(Anthem_PostCallBack),移除這個層。
這樣能夠很方便的模擬出相似 Gmail 中的加載效果。


7、回調過程當中向頁面添加了新的 js 腳本

這種狀況下必須設定一個額外的屬性:
Anthem.Manager.IncludePageScripts = true;

例子:
數組

<script runat="server"> 服務器

protected void button1_Click(object sender, EventArgs e)
{
HtmlButton button = new HtmlButton();
button.InnerText = "Now click me!"
button.Attributes["onclick"] = "ThankYou();"
placeholder1.Controls.Add(button);
placeholder1.UpdateAfterCallBack = true;
string script = @"<script type=""text/javascript"">
function ThankYou() {
alert('Thank you!');
}
</" + "script>"
#if V2
Page.ClientScript.RegisterClientScriptBlock(typeof(Page), script, script);
#else
Page.RegisterClientScriptBlock(script, script);
#endif
Anthem.Manager.IncludePageScripts = true;
}
</script>
框架


8、PreUpdate 事件

控件在 Render 以前,若是 UpdateAfterCallBack 爲 true,則會引起這個事件。
目前這個事件的用途彷佛不大。異步

 

出處:http://www.cnblogs.com/RChen/archive/2006/09/12/anthem_callback.htmlide

相關文章
相關標籤/搜索