AJAX.NET用户开发指南
编写服务端函数
现在我们编写服务器端函数,他们可以被客户端异步的调用。尽管现在还不能支持全部的返回类型,我们仍坚持服务器端添加功能。在codebehind文件的页面类里,添加下面的方法:
'VB.Net
<Ajax.AjaxMethod()> _
Public Function ServerSideAdd (byval firstNumber As Integer, byval secondNumber
As Integer) As Integer
Return firstNumber + secondNumber
End Function
//C#
[Ajax.AjaxMethod()]
public int ServerSideAdd(int firstNumber, int secondNumber)
{
return firstNumber + secondNumber;
}
注意,这个函数有Ajax.AjaxMethod()定制属性,属性服务会告知ajax封装类为此方法创建一个javascript代理,这样才能被客户端调用。
定制客户端调用
接下来在客户端用javascript调用函数。Ajax封装类会创建一个javascript函数,带有两个参数,名字是 类名.ServerSideAdd。作为最基本的功能,我们所需要作的只是调用这个方法并且传递参数:
<%@ Page Inherits="AjaxPlay.Sample" Codebehind="sample.aspx.cs" ... %>
<html>
<head>
<script language="javascript" src="ajax/common.ashx"></script>
<script language="javascript"
src="ajax/AjaxPlay.Sample,AjaxPlay.ashx"></script>
</head>
<body>
<form id="Form1" method="post" runat="server">
<script language="javascript">
var response = Sample.ServerSideAdd(100,99);
alert(response.value);
</script>
</form>
</body>
</html>
当然,我们不能把这么强大的功能仅仅用来通过alert来提醒浏览者,这就是为什么所有的客户端代理(如 类名.ServerSideAdd函数)同时带有一个额外的定制属性。这个属性是用来处理服务器响应的回调函数:
Sample.ServerSideAdd(100,99, ServerSideAdd_CallBack);
function ServerSideAdd_CallBack(response){
if (response.error != null){
alert(response.error);
return;
}
alert(response.value);
}
从上面的代码中可以看出,我们为ServerSideAdd函数增加了一个额外参数ServerSideAdd_CallBack,这个参数就是用来处理服务器端响应的客户端函数。这个callback函数接受一个带有四个关键属性的response对象:
79>
value
511>
服务器端函数执行的返回值(可能是一个字符串、自定义对象或者dataset)
79>
error
511>
如果发生错误,则返回错误信息.
79>
request
511>
原始的xmlHttpRequest请求
79>
context
511>
一个上下文对象
我们首先应该检查是否有错误发生,你可以通过在服务器端函数抛出异常来实现这个error属性。在上面这个例子中,我们简单的alert了一个值,就是value属性;request属性可以用来取得额外的信息(见下面的表格)
如果你想了解更多的关于XmlHttpRequest的知识,可以查看下面的链接: http://www.quirksmode.org/blog/archives/2005/02/xmlhttp_linkdum.html
处理类型
返回一个复杂类型
Ajax可以支持除了我们上面ServerSideAdd函数返回的Int值以外很多类型。他可以直接支持integers, strings, double, booleans, DateTime, DataSets 和 DataTables,也支持简单的自定义类型和数组。其他的类型通过其ToString方式来返回字符串。
返回DataSet的工作就像真正的.net Dataset.给出一个返回DataSet的服务器端函数,我们可以通过下面的方法在客户端显示:
<script language="JavaScript">
//Asynchronous call to the mythical "GetDataSet" server-side function
function getDataSet(){
AjaxFunctions.GetDataSet(GetDataSet_callback);
}
function GetDataSet_callback(response){
var ds = response.value;
if(ds != null && typeof(ds) == "object" && ds.Tables != null){
var s = new Array();
s[s.length] = "<table border=1>";
for(var i=0; i<ds.Tables[0].Rows.length; i++){
s[s.length] = "<tr>";
s[s.length] = "<td>" + ds.Tables[0].Rows.FirstName + "</td>";
s[s.length] = "<td>" + ds.Tables[0].Rows.Birthday + "</td>";
s[s.length] = "</tr>";
}
s[s.length] = "</table>";
tableDisplay.innerHTML = s.join("");
}
else{
alert("Error. [3001] " + response.request.responseText);
}
}
</script>
Ajax也可以支持自定义类,但是需要这个类是可以被序列化的。如下面的类:
[Serializable()]
public class User{
private int _userId;
private string _firstName;
private string _lastName;
public int userId{
get { return _userId; }
}
public string FirstName{
get { return _firstName; }
}
public string LastName{
get { return _lastName; }
}
public User(int _userId, string _firstName, string _lastName){
this._userId = _userId;
this._firstName = _firstName;
this._lastName = _lastName;
}
public User(){}
[AjaxMethod()]
public static User GetUser(int userId){
//Replace this with a DB hit or something :)
return new User(userId,"Michael", "Schwarz");
}
}
我们需要通过调用RegisterTypeForAjax向服务器注册GetUser代理:
private void Page_Load(object sender, EventArgs e){
Utility.RegisterTypeForAjax(typeof(User));
}
在客户端我们可以通过这样的方式调用GetUser函数:
<script language="javascript">
function getUser(userId){
User.GetUser(GetUser_callback);
}
function GetUser_callback(response){
if (response != null && response.value != null){
var user = response.value;
if (typeof(user) == "object"){
alert(user.FirstName + " " + user.LastName);
}
}
}
getUser(1);
</script>
返回值同服务器端对象一样有三个属性(FirstName, LastName and UserId)。
译者注:其他的类型只能由开发者通过在服务器端函数在返回值时自定义转换为ajax支持的类型来实现了,ajax推荐使用ToString方法。