微思考源码weisico.com|分享互联网优质资源,免费织梦模板,WP主题下载

PopupWin应用ASP.NET在web页面上弹出窗口

ASP.NET于web页面上弹出窗口

Highly customizable JavaScript popup control for web page wrapped in ASP.NET custom control.

remex1980 翻译于 2007-5-6 20:23:37

原作者: Tomas Petricek

原文地址:http://www.codeproject.com/aspnet/asppopup.asp

ASP.NET弹出窗口
一个使用javascript编写的,用于在ASP.NET中弹出对话框的用户控件
运行于ie或Mozilla Firefox和Opera上的弹出对话框 

介绍
这篇文章介绍了一个ASP.NET的窗口弹出控件。该控件模仿MSN 消息警告框的样式,但,它是运行于ASP.NET中的。该窗口的样式可以由用户完全控制,通过设置其颜色或预定义的窗口模式就可修改。该控件还支持窗口拖动,用户可以在窗口上的任一位置移动它。

另外一个很重要的特性是:该控件适用于多种浏览器。它已经在Microsoft IE,Mozilla Firefox和Opera上进行过测试。但它在不同浏览器上的外观并不完全一样,所以它还不支持filters (filters 仅仅在Microsoft IE最新版中才得到支持。)你可以得到它的HTML属性,因此,可以通过各种属性控制该控件。

给对话框定制不同颜色 

以下使用popup代表弹出的对话框控件。

行为事件
该控件有两个事件, LinkClicked (当popup窗口被鼠标点击时的动作) 和PopupClosed (用户单击关闭按钮时的动作)。有三种方式如何处理这些事件。具体使用哪种是由ActionType 决定的。三种行为是:
1,MessageWindow (default) ,在这种情况下,用户控件会打开一个新的浏览窗口,在新的窗口中显示指定在Text 属性中的文字。
2, OpenLink,在这种情况下,控件允许你做任何 JavaScript 操作或打开链接导任何其它网页 (Link property). 你还可以改变<A>标签内的Target 属性。产生的代码如:<a href="[Link]" target="[LinkTarget]">Link..</a>,因此在链接中小心地使用双引号。(Target 属性只有在 LinkTarget 为空的时候才被加上去)
3,RaiseEvents 当你选择了这种模式,该控件的LinkClicked 或PopupClosed 事件将会被提升到服务器端执行。

演示 

使用方法
添加这个控件到网页上是很容易的,在Visual studio 开发环境中,你可以仅仅通过在控件工具栏上添加/删除新控件,然后选择本控件的DLL文件。这样,控件就会如普通的按钮、文本框一样,显示在toolbox 中,接下来的使用就是拖到页面上就可以了。

设计
控件对进一步的设计提供了很丰富的支持,你可以在设计过程中改变它的每一个属性。在Action属性目录下,你可以定义当控件被点击之后的具体动作。在Texts和Design属性目录中,你可以修改popup对话框的样式和显示的内容。在Behavior属性中,你可以改变控件被显示或隐藏的时间。AutoShow属性表明是否控件将在页面一被加载的时候就显示。如果你设置DragDrop为true用户还可以改变控件的位置,在页面上拖动该窗口。如果你把ActionType设置成MessageWindow,你可以通过Window属性目录改变最终显示的消息框的属性。最后一些属性位于Layout中,它们决定了该窗口的显示位置。


代码
下面的代码描述了如何设置和显示该控件。
<!-- Popup.aspx -->
<%@ Register TagPrefix="cc1" Namespace="EeekSoft.Web"
  Assembly="EeekSoft.Web.PopupWin" %>

<cc1:popupwin id="popupWin" runat="server" visible="False"
  colorstyle="Blue" width="230px" height="100px" dockmode="BottomLeft"
  windowscroll="False" windowsize="300, 200"></cc1:popupwin>

// Popup.aspx.cs

// 改变动作类型

popupWin.ActionType=EeekSoft.Web.PopupAction.MessageWindow;

 

// 设置popup窗口文本

popupWin.Title="This is popup";

popupWin.Message="Message displayed in popup";

popupWin.Text="Text to show in new window..";

 

// 改变颜色

popupWin.ColorStyle=EeekSoft.Web.PopupColorStyle.Green;

 

// 改变时间

popupWin.HideAfter=5000;

popupWin.ShowAfter=500;

 

// 显示类型(页面加载时显示)

popupWin.Visible=true;

使用anchor控件
设计

popup Anchor 

添加anchor控件到页面上的方法和添加popup控 件到页面上非常相似。当你添加了一个anchor控件到页面上之后,你可以选择任何已经存在于服务端的控件ID,或选择一个你想处理的客户端事件。如果你 只是想重新打开popup控件,你只需要保证popup窗口控件会被传到客户端,并且是可见的就行。如果你不希望popup窗口在页面一载入的时候就显 示,可以设置AutoShow属性为false。
你还可以选择使用PopupWinAnchor来改变popup窗口中的文字。设置anchor控件的ChangeTexts属性为True,然后anchor控件会通过NewTitle,NewMessageNewText设置新的popup窗口文字。

Anchor属性 

代码
下面的例子描述了如何使用PopupWinAnchor控件重新打开刚被关闭的popup窗口。
<!-- Anchor.aspx -->
<%@ Register TagPrefix="cc1" Namespace="EeekSoft.Web"
  Assembly="EeekSoft.Web.PopupWin" %>

<cc1:popupwin id="popupWin" runat="server" visible="False"
  colorstyle="Blue" width="230px" height="100px" dockmode="BottomLeft"
  windowscroll="False" windowsize="300, 200"></cc1:popupwin>
 
<cc1:popupwinanchor id="popupAnchor" runat="server"
  changetexts="False"></cc1:popupwinanchor>
 
<span id="spanReopen"> Click here to reopen popup ! </span>

// Anchor.aspx.cs

// 处理鼠标单击事件

popupAnchor.HandledEvent="onclick";

// .. of spanReopen 元素

popupAnchor.LinkedControl="spanReopen";

// 当事件存在时,显示popup窗口

popupAnchor.PopupToShow="popupWin";

 

// Popup win is visible ..

popupWin.Visible=true;

// .. and will be displayed when page is loaded

popupWin.AutoShow=true;

在执行时动态加载控件
以前在动态加载控件是有问题的,不过已经被修改了;) 这里是一个动态创建popup窗口的例子。 该例子将会演示当用户单击spanReopen 元素时,动态创建popup窗口。(假设,你的页面上有一个叫spanReopen 的元素)

// Create popup window and popup win anchor control (in Page_Load)

PopupWin popupWin=new PopupWin();

PopupWinAnchor popupAnchor=new PopupWinAnchor();

 

// 添加控件到页面

placeHolder.Controls.Add(popupAnchor);  

placeHolder.Controls.Add(popupWin);

 

// Set anchor properties

popupAnchor.PopupToShow=popupWin.ClientID;

popupAnchor.LinkedControl="spanReopen";

popupAnchor.HandledEvent="onclick";

 

// Set popup win properties

popupWin.ActionType=EeekSoft.Web.PopupAction.MessageWindow;

popupWin.Title="This is popup";

popupWin.Message="Message displayed in popup";

 

// Show popup

popupWin.Visible=true;

popupWin.AutoShow=false;

用途
该控件能够很好地用于提示用户重要信息。例如,在web邮件客户端,你可能想提示用户有新消息;在用户可以相互通信的系统中,你可以使用它警告用户有一些人想和它对话。该控件的优点是,它不需要在页面上占有任何固定的位置,而且很醒目。另外一个可以使用的地方是:用于广告显示,这样就没必要做一个flash了。
Anchor控件可以使popup控件更快,并且减少页面的重新加载。比如,你可以使用popup控件为一些页面控件显示快速帮助。快速帮助在文本框被聚焦的时候显示,或在文本框后面加一个按钮,当按钮执行时显示。

尊重版权,请从原文出处下载源代码

演示程序(C# VB.NET)http://www.codeproject.com/aspnet/asppopup/demo.zip

弹出对话框控件的源代码http://www.codeproject.com/aspnet/asppopup/source.zip

文档http://www.codeproject.com/aspnet/asppopup/doc.zip

 


微信公众号 weisico-com

微信公众号weisico-com

转载请注明:微思考学习网-关注技术,分享知识 >> PopupWin应用ASP.NET在web页面上弹出窗口

赞 (0) 收藏
分享到