Call Back Callback – 整合AjaxHepler到NBear

今天将NBear提升至v1.5.5,主要的升级换代一是新增了三个类EntitySerializer,
OneToManyEntitySerializer,

OneToOneEntitySerializer用于简化用户对序列化子件的使,您不要还对正在SerializerHelper提供给你的非常堆序列化方法无所适从了。另一个关键的换代是合二为一了AjaxHelper

Teddy以前的Ajax实现到NBear。AjaxHelper原来的贯彻基于Prototype1.3.1,从Atlas
beta出来从,Teddy已经特别漫长没有创新了,因为自己直接在揣摩AjaxHelper存在的必要性,如果在,该突出什么。这次不是略的Copy到NBear的目,而是完全的合龙,Ajax的实现中心吧改用ASP.NET2.0放权的Callback代替prototype,主要的利用方式不转换,请运行并瞻仰下载后底源码的NBear.WebTest
project的TestAjaxHelper.aspx,该页面包含了运用范例和简易说明。因为约的行使方法没有换,关于AjaxHelper的再度多以前的AjaxHelper系文章。

下载

汝可以打这边下载最新版本的NBear
v1.5.5

以身作则解析

TestAjaxHelper.aspx.cs

 1Ajax 1using System;
 2Ajax 2using System.Data;
 3Ajax 3using System.Configuration;
 4Ajax 4using System.Collections;
 5Ajax 5using System.Web;
 6Ajax 6using System.Web.Security;
 7Ajax 7using System.Web.UI;
 8Ajax 8using System.Web.UI.WebControls;
 9Ajax 9using System.Web.UI.WebControls.WebParts;
10Ajax 10using System.Web.UI.HtmlControls;
11Ajax 11
12Ajax 12public partial class TestAjaxHelper : NBear.Web.UI.Page
13Ajax 13Ajax 14Ajax 15{
14Ajax 16    protected override bool EnableAjaxCallback
15Ajax 17Ajax 18    Ajax 19{
16Ajax 20        get
17Ajax 21Ajax 22        Ajax 23{
18Ajax 24            return true;
19Ajax 25        }
20Ajax 26    }
21Ajax 27
22Ajax 28    protected void Page_Load(object sender, EventArgs e)
23Ajax 29Ajax 30    Ajax 31{
24Ajax 32    }
25Ajax 33}

专注Line14-20,如果欲眼前page的AjaxHelper功能开启,必须像这样继续NBear.Web.UI.Page而非是默认的Page,并且重载EnableAjaxCallback属性,置否true。否则是造访不交AjaxHelper的API的。

TestAjaxHelper.aspx

 1Ajax 34Ajax 35<%Ajax 36@ Page Language=”C#” AutoEventWireup=”true” CodeFile=”TestAjaxHelper.aspx.cs” Inherits=”TestAjaxHelper” %>
 2Ajax 37
 3Ajax 38<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
 4Ajax 39
 5Ajax 40<html xmlns=”http://www.w3.org/1999/xhtml” >
 6Ajax 41<head runat=”server”>
 7Ajax 42    <title>Untitled Page</title>
 8Ajax 43</head>
 9Ajax 44<body>
10Ajax 45    <form id=”form1″ runat=”server”>
11Ajax 46    <div id=”output1″></div>
12Ajax 47    <br /> 
13Ajax 48    <div>
14Ajax 49Ajax 50         <script language=”javascript” type=”text/javascript”>Ajax 51
15Ajax 52            function OnComplete(content)
16Ajax 53Ajax 54            Ajax 55{
17Ajax 56                //you can deal with the return content here
18Ajax 57               alert(content); 
19Ajax 58            }
20Ajax 59         </script>
21Ajax 60        <input type=”button” value=”Callback & Updater using serverside created script handler” onclick=”<%= Ajax.Updater(“controls/ctlHelloWorld”, “output1”, null, “alert”)  %>” /><br />
22Ajax 61        <br />
23Ajax 62        <input type=”button” value=”Callback Only using clientside created script handler” onclick=”Ajax.Callback(‘controls/ctlHelloWorld’, ‘param1=1&param2=22’, OnComplete)” /><br />
24Ajax 63        <br />
25Ajax 64        Both Ajax.Callback & Ajax.Updater have serverside and clientside version and can be writen like these two buttons.<br />
26Ajax 65        <br />
27Ajax 66        The first param of Ajax.Callback and Ajax.Updater must be a UseControl inherits from NBear.Web.UI.AjaxTemplate, and u must override OnAjaxTemplatePreRender() and put init code in it to control what to display in the control.<br />
28Ajax 67        If u put code in Page_Load of this kind of controls, they will never be run.<br />
29Ajax 68        <br />
30Ajax 69        You can deal with the callback return data in custom client script function like the ‘OnComplete’ function in this page.<br />
31Ajax 70        <br />
32Ajax 71        The second param of Ajax.Callback can be “param1=1&param2=22” like params. Please use escape() to wrap this param before pass to serverside.
33Ajax 72        </div>
34Ajax 73    </form>
35Ajax 74</body>
36Ajax 75</html>

瞩目这里少单Button不同之onclick设置方法,两种植艺术等价可选的,也就是说客户端与服务段都出Ajax.Callback和Ajax.Updater函数,该页面的认证文字作了更加解释。点击是页面中之按钮时,callback将给触发,调用并出示controls/ctlHelloWorld.ascx中之始末。

ctlHelloWorld.ascx

1Ajax 76Ajax 77<%Ajax 78@ Control Language=”C#” AutoEventWireup=”true” CodeFile=”ctlHelloWorld.ascx.cs” Inherits=”controls_ctlHelloWorld” %>
2Ajax 79Ajax 80<%Ajax 81# text %><br />
3Ajax 82<br />
4Ajax 83<asp:GridView ID=”GridView1″ runat=”server”>
5Ajax 84</asp:GridView>

留神,这里演示一个杀粗略的多少绑定,复杂绑定也是同样的。

ctlHelloWorld.ascx.cs

 1Ajax 85using System;
 2Ajax 86using System.Data;
 3Ajax 87using System.Configuration;
 4Ajax 88using System.Collections;
 5Ajax 89using System.Web;
 6Ajax 90using System.Web.Security;
 7Ajax 91using System.Web.UI;
 8Ajax 92using System.Web.UI.WebControls;
 9Ajax 93using System.Web.UI.WebControls.WebParts;
10Ajax 94using System.Web.UI.HtmlControls;
11Ajax 95
12Ajax 96public partial class controls_ctlHelloWorld : NBear.Web.UI.AjaxTemplate
13Ajax 97Ajax 98Ajax 99{
14Ajax 100    protected string text = “Hello World”;
15Ajax 101
16Ajax 102    public override void OnAjaxTemplatePreRender()
17Ajax 103Ajax 104    Ajax 105{
18Ajax 106        TestEntity obj = new TestEntity();
19Ajax 107        obj.ID = 1;
20Ajax 108        obj.Name = “test”;
21Ajax 109
22Ajax 110Ajax 111        GridView1.DataSource = new TestEntity[] Ajax 112{ obj, obj, obj };
23Ajax 113
24Ajax 114        DataBind();
25Ajax 115    }
26Ajax 116
27Ajax 117    public class TestEntity
28Ajax 118Ajax 119    Ajax 120{
29Ajax 121        private int _ID;
30Ajax 122        private string _Name;
31Ajax 123
32Ajax 124        public int ID
33Ajax 125Ajax 126        Ajax 127{
34Ajax 128            get
35Ajax 129Ajax 130            Ajax 131{
36Ajax 132                return _ID;
37Ajax 133            }
38Ajax 134            set
39Ajax 135Ajax 136            Ajax 137{
40Ajax 138                _ID = value;
41Ajax 139            }
42Ajax 140        }
43Ajax 141
44Ajax 142        public string Name
45Ajax 143Ajax 144        Ajax 145{
46Ajax 146            get
47Ajax 147Ajax 148            Ajax 149{
48Ajax 150                return _Name;
49Ajax 151            }
50Ajax 152            set
51Ajax 153Ajax 154            Ajax 155{
52Ajax 156                _Name = value;
53Ajax 157            }
54Ajax 158        }
55Ajax 159    }
56Ajax 160}

此间很主要之是Line12以及Line16-24,作为AjaxTemplate的usercontrol必须于NBear.Web.UI.AjaxTemplate继承,如果欲进行尝试数据初始化或者数额绑定,必须重载基类AjaxTemplate的OnAjaxTemplatePreRender()函数,注意,这里并非将代码写在usercontrol的Page_Load里,否则当当AjaxTemplate时无见面让执行。

ok,示例介绍及这里,下面或再说说AjaxHelper区别于一般的Ajax实现之统筹思想!

AjaxHelper的特点

从AjaxHelper第一版本开始,AjaxHelper就是以同等种不绝雷同的款型出现的。尤其是当ASP.NET下,它采取ASP.NET的UserControl作为模版引擎,使得用户想透过ajax回调显示的情节可以一直借用usercontrol所负有的保有可视化设计、ASP.NET通用组件、尤其是数据绑定的造福,从而能够方便的以数据展示与操作分离,构成一个MVC的组织。AjaxHelper只是支援你传递模版的始末通过无刷新的异步callback获取数据,显示到页面上点名的位置要交给用户来处理。这样就算简化了人情的群Ajax实现就传递XML格式数据,或者需要在后台手工构造数据这样的雅靠用户指向数码的拍卖的题目。

配合NBear内置的JSON实现,更能够使基于现在的NBear的Ajax开发,拥有再胜的服务端和客户端交互能力。就像NBear框架的完整形象一样,简单容易用。尤其是这次合并后的AjaxHelper,简化了原本有本的麻烦的有,完全不用例如httpmoudule或者当页面引用某个js文件等如此的安排,用户也可以挑选是否enable,更不见面无故增加页面的大小与服务器处理的承受。

假设您需要Ajax效果和风俗习惯的ASP.NET控件结合使用,或为原本项目有增无减Ajax效果,而无是以通项目总体构架思路都基于Atlas这样的构架重写,那么AjaxHelpler同样会是一个毋庸置疑的挑。

相关文章