用实例学ASP.net2.0的CallBack机制[一] 2008-03-08 11:33
用实例学ASP.net2.0的CallBack机制[一] 2008-03-08 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
}