客服电话
APP下载
迪恩网络APP
随时随地掌握行业动态
官方微信
扫描二维码
关注迪恩网络微信公众号
|
在前面两篇（OWA或Messenger样式的信息提示窗口——编写ASP.NET AJAX Extender控件（上）：客户端Behavior和OWA或Messenger样式的信息提示窗口——编写ASP.NET AJAX Extender控件（中）：封装成服务器端控件）中，我们创建了自己的ASP.NET AJAX Extender控件，这一篇将介绍如何在实际项目中使用该控件。 关于该控件的详细功能、实际运行时的界面效果以及详细属性列表，请参考我的ASP.NET AJAX控件——PopupNotificationExtender：实现OWA或Messenger样式的信息提示窗口这篇文章。不过代码下载和示例程序请看本文接下来的介绍，上文中的内容已经过时。
预先需求 本控件基于ASP.NET AJAX开发，且继承于ASP.NET AJAX Control Toolkit中的AlwaysVisibleControlExtender。所以若要在程序中使用该控件，则必须配置好ASP.NET AJAX并添加好ASP.NET AJAX Control Toolkit程序集的引用（请参考《拥抱变化——从Atlas到ASP.NET AJAX（1）：下载安装总览》）。
添加PopupNotificationExtender的引用 然后将控件的DLL（Dflying.Ajax.PopupNotificationExtender.zip）解压缩至Web站点的bin目录下，添加好对该DLL的引用。
注册控件前缀 在需要使用的页面头部添上如下注册代码： <%@ Register Assembly="Dflying.Ajax.PopupNotificationExtender" Namespace="Dflying.Ajax" TagPrefix="dflying" %>
添加ScriptManager 当然，页面中还需要一个ScriptManager控件： <asp:ScriptManager ID="ScriptManager1" runat="server" />
编写将要弹出的提示窗口 然后定义一个Panel，用来表示提示窗口，当然其中布局样式朋友们可以随心所欲地改变： <asp:Panel ID="thePanel" CssClass="panel" runat="server"> <div style="border: 1px solid black; height: 98px;"> <div style="padding: 3px; background-color: Silver;"> <strong>New Messages:</strong> </div> <img src="icon.gif" style="float: left; display: block; margin: 3px;" /> <div id="result" style="padding: 3px; margin-left: 40px;" /> </div> </asp:Panel> 注意：该Panel中还包含了一个id为result的HTML <div>标签。注意这个<div>，等会服务器端返回的消息将填充到该<div>中。 该Panel应用的CSS Class为panel，定义如下：（注意不可以定义border、margin、padding三个属性，如果需要，可以在内部标签<div>中使用） .panel {
font-size: 80%; background-color: white; width: 200px; height: 100px; overflow: hidden; }
添加PopupNotificationExtender控件 然后是PopupNotificationExtender控件的代码： <dflying:PopupNotificationExtender ID="pne" TargetControlID="thePanel" runat="server" VerticalSide="Bottom" HorizontalSide="Right" HorizontalOffset="20" VerticalOffset="20" ServicePath="NotificationService.asmx" ServiceMethod="GetNotification" QueryServiceInterval="6000" ResultLabelID="result" /> 其中：
编写服务器端Web Service 再看看服务器端Web Service的代码： using System;
using System.Web;
using System.Web.Services;
using System.Web.Services.Protocols;
[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] [System.Web.Script.Services.ScriptService()] public class NotificationService : System.Web.Services.WebService { private static int m_count = 0; [WebMethod] public string GetNotification() {
if (checkNewMessage())
{
// return the HTML message content.
return string.Format("<a href=\"#\">You've received a new message #{0}.</a>", m_count++); } else
{
// if there's no new meesage, just return an empty string.
return string.Empty; } } private bool checkNewMessage() {
// TODO: whatever you want to check if there's a message.
return true; } } 很简单不多说了，GetNotification()方法没有任何传入参数，在该方法中，我们可以随便用什么方法看看是否有新的消息需要传递给客户端。如果有的话，那么返回代表该消息的HTML字符串，如果没有，则返回空字符串即可。之后客户端如果收到的是一个非空字符串，则将弹出窗口显示出来，如果受到空字符串，那么不会显示任何东西。 程序运行界面就和本文开始的两幅图像一样，你也可以下载完整的源文件（代码+示例程序，PopupNotification.zip）亲自体验一下。
运行时的程序界面 请参考我的ASP.NET AJAX控件——PopupNotificationExtender：实现OWA或Messenger样式的信息提示窗口这篇文章。
代码下载 完整的源文件+示例程序：PopupNotification.zip PopupNotificationExtender编译好的程序集：Dflying.Ajax.PopupNotificationExtender.zip。
随便再说两句 实际上，这个Extender所做的事情就是在服务期端封装了ASP.NET AJAX客户端的行为（Behavior）组件，整个控件开发过程中的大头部分仍然是那个JavaScript文件。之所以要这样封装，是为了方便熟悉ASP.NET服务器端开发模型的程序员使用，并提高组件的可重用性。 查看页面的源文件，可以看到在源文件的末尾部分有如下几行（为清晰起见，代码经过格式化）： <script type="text/javascript">
<!-- Sys.Application.initialize(); Sys.Application.add_init( function() {
$create(Dflying.Ajax.PopupNotificationBehavior, {
"HorizontalOffset":20,
"HorizontalSide":2,
"QueryServiceInterval":6000,
"ResultLabelID":"result", "ServiceMethod":"GetNotification", "ServicePath":"NotificationService.asmx", "VerticalOffset":20,
"VerticalSide":2,
"id":"pne" }, null,
null,
$get("thePanel")
); } ); // -->
</script> 这也正是ASP.NET AJAX客户端的行为的声明方法。 ASP.NET AJAX的客户端部分设计极为巧妙，非常值得我们去仔细研究。 |
请发表评论