分清ASP.NET AJAX中的Extender和Behavior模型

ASP.NET AJAX提出了多种模型，在客户端有Component、Control和Behavior模型，在服务器端有ScirptControl和Extender模型。这些模型各有各的用途，但是请注意非常重要的一点：客户端模型和服务器端模型是相互独立的。

ASP.NET AJAX的重要组件之一是Ajax Control Toolkit，其中包括了大量的Extender和Behavior。其中的Extender使用ASP.NET AJAX提出的Extender模型，在客户端使用了Microsoft AJAX Library提出的Behavior模型。Extender和Behavior模型的组合提供了丰富的效果。那么，究竟什么是Extender模型，什么是Behavior模型呢？

服务器端的Extender控件其实是一个继承了Control类并且实现了IExtenderControl接口的类，我们在开发时也可以直接继承ExtenderControl类，它已经满足了上述条件并且定义了一些常用的方法。Extender控件的作用，简单说来只是想客户端输出脚本，更确切地说，是将需要在页面上执行的脚本告诉ScriptManager，ScriptManager会根据目前的状况（普通加载还是异步回送）选择不同的输出方式。从理论上来说，Extender可以输出任意脚本。因此我们只能说“Ajax Control Tookit中的Extender在客户端使用了Behavior”而不能说“Extender模型在客户端使用了Behavior模型”。

Behavior模型在客户端提供了丰富的功能，它操作的完全是客户端对象，有些可能会访问Web Service方法，但是这并不影响它仅仅是在客户端工作的这个特性。Behavior完全可以独立于服务器端工作，客户端（浏览器）只是按部就班地执行客户端的代码，它也不会知道究竟是何种服务器技术生成了这些代码。

因此，我们在使用Ajax Control Tookit时，也必须牢记以下几条：

Extender模型和Behavior模型没有必然联系。
Behavior可以独立于Extender执行。
所有效果是由Behavior提供的。

关于第1条已经在上文中解释过了。在我之前的一篇文章“ ModalUpdateProgress控件”中利用了第2条特性。在ModalUpdateProgress控件中我使用了ModalPopupBehavior，我的做法是从ModalPopupExtender中提取所有需要的JavaScript文件，并输出至页面，如下：

private IEnumerable<ScriptReference> GetExtenderReferences()
{if (extenderReferences == null){lock (typeof(ModalUpdateProgess)){if (extenderReferences == null){extenderReferences = (new ModalPopupExtender() as IExtenderControl).GetScriptReferences();}}}return extenderReferences;
}

因此，我就能够在客户端使用ModalPopupBehavior来构造我所需要的效果了，这里没有Extender，这里只有Behavior。

关于第3条特性，我认为是最重要的，也是最常利用的一条。我经常会收到例如“如何点击另一个按钮让CollapsiblePanel收缩或打开”或者“如何切换ToggleButton状态”这样的提问，其实这些问题的答案是相同的，使用JavaScript来操作Behavior。Ajax Control Toolkit在服务期端提供的控件实在是太好用了，以至于官方将其托托放放的功能演示了一遍又一遍，乐此不疲。大量的演示却让人忘记了客户段的Behavior才是关键，Behavior才是让客户端丰富多彩的功臣。

最近有位朋友问我，如何在客户端使用Authentication Service登陆用户以后，用ModalPopupExtender的方式将结果显示给用户呢？其实关键还是在于使用JavaScript来操作ModalPopupBehavior。我在这里演示一下使用JavaScript操作ModalPopupBehavior的方法。

首先，在服务器端放置一个ScriptManager、一个TextBox、一个Panel和一个ModalPopupBehavior。

<asp:ScriptManager ID="ScriptManager1" runat="server" />
<asp:TextBox ID="TextBox1" runat="server" style="display:none;" />
<asp:Panel runat="server" ID="popupPanel"style="border: solid 1px black; padding: 10px; width: 300px; display:none;"><b style="font-size: 15pt;">Here's the Message</b><br /><asp:Button ID="Button1" runat="server" Text="Button" />
</asp:Panel>
<ajaxToolkit:ModalPopupExtender runat="server"TargetControlID="TextBox1" PopupControlID="popupPanel"OkControlID="Button1" BehaviorID="modalPopup" />

一切都是最平常的使用方式，只是以下几点需要注意：

TextBox的display设为none：因为ModalPoupBehavior必须要有一个TargetControl，而这个TargetControl就作为弹出窗口的触发器。我们现在必须把这个触发器隐藏掉，不过请注意不能将其Visible设为False，否则客户端的DOM结构中就没有这个文本框了。
弹出Panel的display设为了none：这个已经是使用ModalPoupExtender的规则之一了，如果不将其display设为none，在页面打开的瞬间Panel会出现在页面上，然后马上消失。这样除了让用户看到了Panel之外，还可能影响布局，让页面显得一片混乱。
ModalPopupExtender设置了BehaviorID：这是使用JavaScript操作Ajax Control Toolkit中Behavior的关键。在客户端构造Behavior时可以没有ID，但是如果没有ID的话则无法在客户端操作Behavior对象了。

然后，我们就可以在客户端放置一个按钮，然后使用JavaScript弹出窗口了。请注意，我们使用了$find通过BehaviorID来得到了ModalPopupBehavior实例，然后调用它的show方法：

<input type="button" value="Popup" onclick="$find('modalPopup').show();" />

这样，窗口就弹出了。其实一切就是这么简单。

可能唯一的问题就是开发人员并不清楚该调用Behavior的哪个方法来工作。这其实并不构成障碍，我们只要查看Behavior的源代码，看看那些没有下划线前缀的方法（即公有方法）中名字和功能比较接近的即可。这就是使用合适方法名的好处，根本不需要些注释就能明白方法的作用——更何况Ajax Control Toolkit中的Behavior注释非常详细。:)

这才是灵活使用Extender的方式。

©著作权归作者所有：来自51CTO博客作者jeffz的原创作品，如需转载，请与作者联系，否则将追究法律责任

AJAX 模型 ASP.NET Ajax & Atlas相关

微博 QQ 微信

上一篇：深入JavaScript与.NE... 下一篇：深入JavaScript与.NE...

jeffz

238篇文章，49W+人气，0粉丝

Ctrl+Enter 发布

发布

取消

猜你喜欢

我的友情链接扩展LINQ to SQL：使用Lambda Expression批量删除数据简述centOS 7系统用户和组的管理及配置解析DELL R710服务器迁移操作内容开学季出大事：某教育局丢失3台虚拟机 EVA4400存储虚拟机+数据库数据恢复成功案例服务器数据恢复通用方法+服务器分区丢失恢复案例在CentOS7上部署squid缓存服务器及代理功能 EMC 5400服务器raid阵列瘫痪数据恢复成功案例服务器数据恢复案例 / raid5阵列多块硬盘离线处理方法华为存储服务器卷丢失数据恢复成功案例斐讯K3C路由器无需刷机用vlmcsd搭建KMS服务器激活Windows&office 高校服务器虚拟化——高校数据中心建设【长文+图片】HP FC MSA2000服务器瘫痪数据恢复过程服务器断电瘫痪数据丢失后恢复数据的过程华为5800服务器raid阵列数据恢复成功案例【长文慎点】IBM X3850服务器删除并重建虚拟机恢复过程 HP EVA4400服务器RAID信息丢失数据恢复方法 Apache 工作模式的优化深入部署PXE远程安装服务并实现Kickstart无人值守安装

扫一扫,领取大礼包

jeffz

转载于:https://blog.51cto.com/jeffz/59885