onComplete(可选):可用于对返回数据进行特殊处理的回调函数,函数格式 function(str),str为返回的数据
SerializeForm(form)函数,用于序列化
form:可以是对指定的引用或ID值
(2)在server端,Ajax.aspx文件封装了对由客户端ajaxTemplate指定的UserControl的调用,其余的具体逻辑功能则在特定的UserControl及其ascx.cs内实现;
(3)这样,具体执行一次callback时,编程人员只需在页面引用AjaxHelper.js,并在指定的位置通过javascript:Updater(ajaxTemplate, output, params, onComplete)进行调用,如果需要对某一form进行提交,则可调用javascript:SerializeForm(form)序列化该form并传给params,当然也可以手动构造params,并指定将返回数据通过设置output应用的页面或通过onComplete自定义处理。
(4)由于充分使用UserControl,意味着,可以充分利用asp.net原有的web服务器端控件和数据绑定机制,这样其实,已经很大程度上简化了返回数据的构造,在ascx.cs中,通过Request.Form[ParamName]就能访问到client端传入的params,再访问逻辑代码获取源数据。
5、范例
包含在源码中的范例实现了一个简单的无刷新获取博客园首页内容到一个textarea的功能,详见源码!
部分范例源码:
Default.aspx
< %@ Page language="c#" Codebehind="Default.aspx.cs" AutoEventWireup="false" Inherits="CN.Teddy.AjaxHelper.WebForm1" %>
< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
< HTML>
< HEAD>
< title>WebForm1< /title>
< meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
< meta name="CODE_LANGUAGE" Content="C#">
< meta name="vs_defaultClientScript" content="JavaScript">
< meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
< script type="text/javascript" language="javascript" src="js/AjaxHelper.js">< /script>
< /HEAD>
< body>
< form id="Form1" method="post" runat="server">
< div id="view2">loading< /div>
< script type="text/javascript">
Updater('AjaxTemplate/GetPageSrc', 'view2', 'url=http://www.cnblogs.com');
< /script>
< /form>
< /body>
< /HTML>
< %@ Page language="c#" Codebehind="Default.aspx.cs" AutoEventWireup="false" Inherits="CN.Teddy.AjaxHelper.WebForm1" %>
< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
< HTML>
< HEAD>
< title>WebForm1< /title>
< meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
< meta name="CODE_LANGUAGE" Content="C#">
< meta name="vs_defaultClientScript" content="JavaScript">
< meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
< script type="text/javascript" language="javascript" src="js/AjaxHelper.js">< /script>
< /HEAD>
< body>
< form id="Form1" method="post" runat="server">
< div id="view2">loading< /div>
< script type="text/javascript">
Updater('AjaxTemplate/GetPageSrc', 'view2', 'url=http://www.cnblogs.com');
< /script>
< /form>
< /body>
< /HTML>