HttpHandler, Json, jQuery, ASP.Net UserControl各部分相应的作用如下,
HttpHandler:相应客户请求,并通过调用service返回相应数据。
Json:用来传输简单数据的数据格式。
JQuery:通过JQuery的API调用ajax,修改页面数据、样式等。
UserControl:生成复杂的HTML数据,并回传给客户端。
一、页面请求部分
页面请求部分通过JQuery的Ajax API向HttpHandler发出request,有post和get两种方式。
JQuery调用的简单代码如下
varshowData=function() {varhttpHandler="httphandler.ashx";//request URLvarparams={"name":"test"};//parametersvartype="json";//type, "XML", "html", "script", "json", "jsonp", "text".varcallBack=function(data, status) {//call back functionalert(data.toString());
}
$.get(httpHandler, params, callBack,"json");
自己写的一个小工具函数,类似于c#的String.format();
varformatString=function(inputStr, parameters) {
for(vari=0; i
inputStr=inputStr.replace("{"+i+"}", parameters[i]);
}returninputStr;
}
这样就可以简单的封装请求,
varhttpHandler=formatString("httphandler.ashx?name={0}",["test"]);
二、HttpHandler响应
HttpHandler用来响应browser发送的request,它通过params接收request请求的参数,然后调用相应的service处理请求,最终返回数据给客户端。
对于如何调用service的方法,我是通过反射的方式去实现的,当然,反射势必会影响一定的效率,这里也可以考虑用Emit实现。
stringname=context.Request.Params["name"];//request params, just like id and name etc.
stringtype=context.Request.Params["type"];//which type to responsestringmethodName=context.Request.Params["methodName"];//get the method name to invokeService service=newService();objectobj=service.GetType().InvokeMember(
methodName,
System.Reflection.BindingFlags.InvokeMethod,null,
service,newobject[]{ name }//here it the method parameters);
Service返回的数据,若回传到客户端之后,根据客户端生成html的难度一般可以将回传数据分为两种形式,
将service返回的实体或者DataTable生成Json,然后输出到客户端
先通过UserControl直接生成Html,然后输出到客户端(这种方式有可以充分利用UserControl的优势,可视化编辑和WebForm的服务器端控件)
两种形式都比较简单,生成Json可以使用Json.net,它提供了将实体类和DataTable直接序列化成Json的方式。
至于通过UserControl生成Html,可以用以下代码实现,
publicclassViewManagerwhere T : UserControl{privatePage pageHolder;publicT LoadUserControl(stringpath){this.pageHolder=newPage();return(T)this.pageHolder.LoadControl(path);
}publicstringRenderView(T control){
StringWriter writter=newStringWriter();this.pageHolder.Controls.Add(control);
HttpContext.Current.Server.Execute(this.pageHolder, writter,false);returnwritter.ToString();
}}
HttpHandler 中将UserControl生成的html输出到客户端的代码如下,
ViewManagermanager=newViewManager();
UserControl control=manager.LoadUserControl("~/Controls/UserControl.ascx");
context.Response.ContentType="text/plain";
context.Response.Write(manager.RenderView(control));
如果,你对如何通过UserControl生成Html代码感兴趣的话,可以查看老赵的这篇文章,http://www.cnblogs.com/JeffreyZhao/archive/2008/07/14/1241979.html
三、编写callback函数处理HttpHandler回传的数据
数据回传到客户端之后,可以通过回调函数处理HttpHandler回传的数据,然后将该数据生成的html代码加载到页面上。
回调函数就是第一部分中的编写的callback函数。
var callBack=function(data, status){//call back functionalert(data.toString());
}
假设页面有如下代码,而回传的数据是html代码的话
则我们可以编写如下JavaScript,用来增加div中的内容。
varcallBack=function(data, status) {//call back function
$("#test").html(data);
}
如果回传数据是json,而我们想通过该json生成table的话,也可以写一个通用的函数,专门用来生成table的html,然后将该table的html加载到页面上。
varwriteTable=function(jsonData) {if(jsonData.length>0) {varcontent="
{ content+="
"+key+""; }content+="
";$.each(jsonData,function(i) {
content+="
";for(varkeyinjsonData[i]) {content+="
"+jsonData[i][key]+""}content+="
";});
content+="
";content+="
";returncontent;}
}
上面就是一次完整的调用过程。
四、总结
相对于asp.net ajax的方式,通过这样的方式作为Ajax的解决方案,个人认为有以下优点:
控制性,相对于封装好的asp.net ajax的update panel,这样的方式无疑更容易控制。
灵活性,想什么时候ajax就什么时候ajax。
性能,这种方式带来的性能还是有一定的提升的。
缺点也很明显,
开发的难度增加了。
抛弃了相对来说比较完整的WebForm模型,而只是将WebForm单纯的作为模板来用。