Atlas编程揭密之数据绑定[多图]
日期:2007年6月10日 作者:-
Atlas架构提供了一种比ASP.NET中数据绑定(data binding)强大得多的客户端绑定模型。这种模型异常灵活,甚至有些类似WPF(Windows Presentation Foundation)中的绑定模型。Atlas提供的绑定模型允许您将某对象的任意一个属性绑定到另外一个对象的任意一个属性上。它不单单可以应用于数据绑定,甚至可以将某个控件的样式绑定到另外一个控件上。这样使得在Atlas中将一切关联起来变成可能。
在本文中,我将尝试分析一些Atlas实现代码来解释Atlas是如何完成Binding的。
首先让我们察看一小段应用Atlas Binding的代码。这里将一个textbox的text属性和一个select list的selectedValue属性绑定起来。无论你改变其中的哪个,在另一个上面都会有立刻得到体现。
HTML和ASPX,定义textbox和select list。(注意必须声明一个ScriptManager服务器端对象,以引入Atlas必须的javascript文件。)
<atlas:ScriptManagerID="ScriptManager1"runat="server"/>
<div>
Inputanintegerfrom1to5.<br/>
<inputid="myTextBox"type="text"/><br/>
Selectanitem.<br/>
<selectid="mySelect">
<optionvalue="1">value1</option>
<optionvalue="2">value2</option>
<optionvalue="3">value3</option>
<optionvalue="4">value4</option>
<optionvalue="5">value5</option>
</select>
</div>
Atlas脚本,将上面两个HTML控件“升级”成Atlas控件。
<pagexmlns:script="http://schemas.microsoft.com/xml-script/2005">
<references>
</references>
<components>
<textBoxid="myTextBox">
<bindings>
<bindingdataContext="mySelect"dataPath="selectedValue"property="text"direction="InOut"/>
</bindings>
</textBox>
<selectid="mySelect"/>
</components>
</page>
如上所示,我们只需要书写一小段简单的代码即可实现需要的绑定功能。
Atlas是如何实现这些的呢?首先,Atlas需要有一种途径来监听绑定控件的绑定属性的变化(除非你不需要Atlas提供的自动绑定功能)。在Atlas.js中定义了一个名为Sys.INotifyPropertyChanged的接口,类似.NET中提供的一样。对象可以实现这个接口以期让别的对象监听到自己的属性值的变化。Atlas中所有组件的基类,Sys.Component,实现了这个接口。Sys.Component同样提供一个方法raisePropertyChanged(propertyName),这个方法应该在每个属性的setter中被调用以发出INotifyPropertyChanged.propertyChanged事件。
目前为止,我们可以看一下Atlas控件中textbox的具体实现。看看textbox中是如何在相应的HTML事件发出时同样发出propertyChanged事件的。
var_text;
var_changeHandler;![Atlas编程揭密之数据绑定[多图]图片28](http://www.hackhome.com/uploadImages/2007-5-3/2007537425314432.gif)
![Atlas编程揭密之数据绑定[多图]图片29](http://www.hackhome.com/uploadImages/2007-5-3/2007537425357317.gif)
this.get_text=function()
{
returnthis.element.value;
}![Atlas编程揭密之数据绑定[多图]图片34](http://www.hackhome.com/uploadImages/2007-5-3/2007537425377395.gif)
![Atlas编程揭密之数据绑定[多图]图片35](http://www.hackhome.com/uploadImages/2007-5-3/2007537425347752.gif)
this.set_text=function(value)
{![Atlas编程揭密之数据绑定[多图]图片38](http://www.hackhome.com/uploadImages/2007-5-3/2007537425371967.gif)
if(this.element.value!=value)
{
this.element.value=value;
this.raisePropertyChanged('text');
}
}![Atlas编程揭密之数据绑定[多图]图片45](http://www.hackhome.com/uploadImages/2007-5-3/2007537425471919.gif)
![Atlas编程揭密之数据绑定[多图]图片46](http://www.hackhome.com/uploadImages/2007-5-3/2007537425495578.gif)
this.initialize=function()
{
Sys.UI.TextBox.callBaseMethod(this,'initialize');![Atlas编程揭密之数据绑定[多图]图片50](http://www.hackhome.com/uploadImages/2007-5-3/2007537425450458.gif)
_text=this.element.value;![Atlas编程揭密之数据绑定[多图]图片52](http://www.hackhome.com/uploadImages/2007-5-3/2007537425493029.gif)
_changeHandler=Function.createDelegate(this,this._onChanged);
this.element.attachEvent('onchange',_changeHandler);![Atlas编程揭密之数据绑定[多图]图片55](http://www.hackhome.com/uploadImages/2007-5-3/2007537425697876.gif)
_keyPressHandler=Function.createDelegate(this,this._onKeyPress);
this.element.attachEvent('onkeypress',_keyPressHandler);
}![Atlas编程揭密之数据绑定[多图]图片59](http://www.hackhome.com/uploadImages/2007-5-3/2007537425625982.gif)
![Atlas编程揭密之数据绑定[多图]图片60](http://www.hackhome.com/uploadImages/2007-5-3/2007537425684897.gif)
this._onChanged=function()
{![Atlas编程揭密之数据绑定[多图]图片63](http://www.hackhome.com/uploadImages/2007-5-3/2007537425760931.gif)
if(this.element.value!=_text)
{
_text=this.element.value;
this.raisePropertyChanged('text');
}
}
可以看到,当text属性改变时,Atlas发出了propertyChanged事件,这就使绑定到这个属性成为可能。
而后Atlas的绑定模型捕获到了这个事件,再根据binding声明查找出与其相关的目的对象以及相应的属性,并调用这个属性的Setter来实现目的对象属性的变化。
如果源对象(source object)实现了INotifyPropertyChanged接口,并且改变的属性就是dataPath 中指定的属性,同时direction 设定为In或者InOut,Atlas绑定将通过分析引入(incoming)的binding来处理propertyChanged事件(参考下面将要介绍的evaluateIn()方法)。
类似的,如果目的对象(target object)实现了INotifyPropertyChanged接口,并且改变的属性就是property中指定的属性,同时direction 设定为Out或者InOut,Atlas绑定将通过分析流出(outgoing)的binding来处理propertyChanged事件(参考下面将要介绍的evaluateOut()方法)。
接下来让我们察看binding实现代码中的的公有方法和属性来分析一下Atlas绑定的核心实现。在这里没有必要列出涉及绑定的全部代码,如果您感兴趣,可以用关键词Sys.BindingBase和Sys.Binding 在Atlas.js文件中进行搜索。首先是Sys.BindingBase提供的方法和属性。
- [1] [2] [3] 下一页
-
- Atlas编程揭密之数据绑定[多图] 相关文章:
- Atlas编程揭密之数据绑定[多图] 相关软件
- 特别声明:本站除部分特别声明禁止转载的专稿外的其他文章可以自由转载,但请务必注明出处和原始作
- 者.文章版权归文章原始作者所有.对于被本站转载文章的个人和网站,我们表示深深的谢意。如果本站转
- 载的文章有版权问题请联系编辑人员,我们尽快予以更正. 转载请注明来源:http://www.hackhome.com
| ·利用JMF进行多媒体编程[多图] |
| ·使用高级条件筛选Excel表中的数据[多图] |
| ·数据库连接字符串大全 |
| ·编程技巧:Java串口通信简介 |
| ·SQL数据库建立[多图] |
| ·软件测试开发技术数据库的跨平台设计 |
| ·socket编程原理 |
| ·ASP.NET 3.5下基于Crystal Reports的报表编程[多图] |
| ·vb编程标准 |
| ·com编程精彩实例 |
| ·海纳资讯数据挖服务共享版 V1.2.3.6 |
| ·高级语言C++程序设计编程范例与精解 |
| ·C#网络应用编程 |
| ·C语言精彩编程百例 |
| ·64位 CPU 指令集及编程方法 |
| ·精通Oracle 10g PL SQL编程.rar |
上一篇:网站项目系统分析及软件建模
下一篇:实施UML九项注意
