用实例学ASP.net2.0的CallBack机制[一]　20080308 11:33

Ajax技术的出现，使到传统的B/S软件得到了前所未有的发展，使用Ajax机制，可以使用客户端与服务器端的数据传输量大大减小。在ASP.net2.0中，虽然已经有了Ajax1.0以及相对应的ToolKits（工具包），但实际上，在未布Ajax1.0之前，ASP.net2.0已经内置了简单的Ajax功能，这就是称为CallBack（回调）机制。

接下来，我将用一两个实例的方法，来讲解如何得到CallBack机制及其应用。

在开始实例之前，我们需要讲解一下一个接口。ICallbackEventHandler，这个接口用于指示控件(control)可以作为服务器的回调事件的目标，当然，也包括页面(page)本身，因为页面本身也是一个控件。

默认情况下，page类是没有实现ICallbackEventHandler接口的，因此，为了使到页面拥有回调的能力。我们必须使到我们的页面类实现ICallbackEventHandler接口。因此，必须编写如下代码：

public partial class Default2 : System.Web.UI.Page, ICallbackEventHandler
{

……//页面逻辑

}

实现ICallbackEventHandler接口的类，必须显式实现其两个成员：GetCallbackResult与RaiseCallbackEvent，这两个函数里，RaiseCallbackEvent是用来接口来自客户端的参数，并进行业务逻辑后，通过GetCallbackResult把结果返回到客户端的调用者的。而在客户端，我们也必须编写两个函数，这两个函数分别扮演调用者跟反馈者的作用。比如，在我们这个例子中，我们就写了这样两个客户端JS函数：

//SendToServer函数是调用者
function SendToServer() {
……//业务逻辑
}

//onResponse是反馈者
function onResponse(args,context){
……//业务逻辑
}

因此，就有了如下的流程图：

接下来，我们将通过一个简单的计算器的实现，要说明CallBack机制。

效果：

当输入的不是数字或服务器端业务逻辑出现错误时，出现如下效果

页面代码如下：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
<script language="javascript" type="text/javascript">
// <!CDATA[

function SendToServer() {
    var num1 = document.getElementById("txtNum1");
    var num2 = document.getElementById("txtNum2");
    var nums = num1.getAttribute("value") + "|" + num2.getAttribute("value");
    <% = ClientScript.GetCallbackEventReference(this, "nums", "onResponse", null) %>
}

function onResponse(args,context){
document.getElementById("txtResult").value = args;
}

// ]]>
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <input id="txtNum1" size="3" type="text" />＋
        <input id="txtNum2" size="3" type="text" />＝
        <input id="txtResult" size="8" type="text" />
        <input id="Button1" type="button" value="compute" onclick="SendToServer()" /></div>
    </form>
</body>
</html>
后台代码如下：

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class Default2 : System.Web.UI.Page,ICallbackEventHandler
{
#region ICallbackEventHandler 成员

    private string result = string.Empty;
    string ICallbackEventHandler.GetCallbackResult()
    {
        return result;
    }

    void ICallbackEventHandler.RaiseCallbackEvent(string eventArgument)
    {
        string[] args = eventArgument.Split('|');
        if (args == null || args.Length != 2)
        {
            result = "无效的参数";
            return;
        }
        try
        {
            result = Convert.ToString((Convert.ToInt32(args[0]) + Convert.ToInt32(args[1])));
        }
        catch (Exception)
        {

            result = "无效的参数";
        }

    }

#endregion
}

用实例学ASP.net2.0的CallBack机制[一] 20080308 11:33

用实例学ASP.net2.0的CallBack机制[一]　20080308 11:33