编写客户端脚本
客户端脚本主要是用来在服务器端和客户端之间进行信息的交互,就拿本例来说,我们在前面的页面逻辑代码中使用了一个名为eventArgument参数,这是怎么实现参数的传递的呢?我们将在后面的章节进行讨论,现在在页面中添加如下的JavaScript函数代码
function CallServer(inputcontrol,context)
{
//回调还没有处理完全时其预先加载的显示值
context.innerHTML = "加载中......";
//为你在文本框中输入的信息,并且arg在这里就是将其值传递到
//RaiseCallbackEvent(String eventArgument)方法对应的eventArgument中
arg = inputcontrol.value;
//获取一个对客户端函数的引用;调用该函数时,将启动一个对服务器端事件的客户端回调。
<%= ClientScript.GetCallbackEventReference(this, "arg", "ReceiveServerData", "context")%>;
}
我们在上述的JavaScript函数代码引用了一个ClientScript.GetCallbackEventReference(……)方法,该方法实现的是什么功能呢?下面是摘自MSDN2上的对ClientScript.GetCallbackEventReference(……)的详细说明。
public string GetCallbackEventReference (Control control,string argument,string clientCallback,string context)
参数:
参数 作用
control 处理客户端回调的服务器 Control。该控件必须实现 ICallbackEventHandler 接口并提供 RaiseCallbackEvent 方法。
argument 从客户端脚本传递一个参数到服务器端的RaiseCallbackEvent 方法。
clientCallback 一个客户端事件处理程序的名称,该处理程序接收服务器端事件返回的结果。
context 启动回调之前在客户端的客户端脚本信息。脚本的结果传回给客户端事件处理程序。
返回值 调用客户端回调的客户端函数的名称。
下面是ClientScriptManager.GetCallbackEventReference 方法的重载列表
名称 说明
ClientScriptManager.GetCallbackEventReference (Control, String, String, String) 获取一个对客户端函数的引用;调用该函数时,将启动一个对服务器端事件的客户端回调。此重载方法的客户端函数包含指定的控件、参数、客户端脚本和上下文。
ClientScriptManager.GetCallbackEventReference (Control, String, String, String, Boolean) 获取一个对客户端函数的引用;调用该函数时,将启动一个对服务器端事件的客户端回调。此重载方法的客户端函数包含指定的控件、参数、客户端脚本、上下文和布尔值。
ClientScriptManager.GetCallbackEventReference (Control, String, String, String, String, Boolean) 获取一个对客户端函数的引用;调用该函数时,将启动一个对服务器端事件的客户端回调。此重载方法的客户端函数包含指定的控件、参数、客户端脚本、上下文、错误处理程序和布尔值。
ClientScriptManager.GetCallbackEventReference (String, String, String, String, String, Boolean) 获取一个对客户端函数的引用;调用该函数时,将启动一个对服务器端事件的客户端回调。此重载方法的客户端函数包含指定的目标、参数、客户端脚本、上下文、错误处理程序和布尔值。 我们就整个程序作个系统的说明,并且列出前台的页面代码和后台的逻辑代码,这样可以使得你对程序有个直观的理解。
后台代码 CallBackExample.ASPx.cs
代码说明:
若要从客户端成功运行服务器代码,而不执行回发,必须在服务器页代码中实现合适的接口。为此我们在第12行代码中对 ICallbackEventHandler 接口进行声明。第15和19行创建了两个服务器端的代码回调方法。第15行的"RaiseCallbackEvent()"方法中的"eventArgument"字符串参数是来什么地方呢?转到前台页面的第10行代码,arg就相当于传递给"RaiseCallbackEvent()"方法的实参。第19行的"GetCallbackResult()"方法则将通过"RaiseCallbackEvent()"方法得到的结果返回给客户端,即结果"result"最终被传递到前台页面的第15代码所示的"ReceiveServerData()"方法的"result"参数中。
前台代码 CallBackExample.aspx
代码说明:
为了向服务器页发送回调和接收结果这两个功能,我们在前台页面中定义了2个客户端脚本函数。第7行所示的"CallServer()"函数实现的就是发送回调的功能,注意发送回调的函数实际是在服务器端实现的,这是因为真正实现发送回调的是第11行的"ClientScript.GetCallbackEventReference()"方法,而"CallServer()"函数只是对"ClientScript.GetCallbackEventReference()"方法的引用,并提供一些必要的参数。
现在我们来详细讲解下这些客户端函数的具体实现细节,我们通过单击页面第25和26行所声明的按钮后,将触发OnClick事件。
在"CallServer()"中将文本框和标签作为参数传递到第7行相应的JavaScript函数后,"inputcontrol"和"context"就如同成为文本框和标签控件形参数。第9行代码表示没有接受到回调结果前"context"将显示一个"加载中……"的信息,直到回调完成后才用第17行的代码将回调的结果用"context"重新进行显示。第10行代码表示将文本框的输入值赋予"arg",并且"arg"在第12行代码的ClientScript.GetCallbackEventReference()方法中作为对应的第2个参数。第一个参数用"this"表示对本页面的引用,因为ClientScript.GetCallbackEventReference()方法也是在CallBackExample.aspx实现的。第三个参数表示接受回调结果的客户端函数,它在这和第15行代码所实现的ReceiveServerData()函数相匹配(注意函数名称必须是一致的,否则会导致出错),回调的结果将通过"context"进行显示。第四个参数"context"用于从服务器端返回的上下文,因为ClientScript.GetCallbackEventReference()方法是在服务器端执行的,在该方法中原本传递的"context"内容为一个"加载中……"的信息,回调返回后"context"在第17行中被重新进行改写,如果没有对上下文的引用的话,你可以将该参数设置为"null"。