ASP.NET Popup Control
- Download demo project (C# and VB.NET) - 38.1 Kb
- Download control with source - 37.7 Kb
- Download control documentation - 71.1 Kb
This article describes an ASP.NET popup control. This control imitates MSN Messenger alert, but it is designed for use in a web page. Graphical appearance of this control can be completely changed by using one of predefined styles or by modifying all colors used on the control. Control supports Drag&Drop, so user can move control on the page, where he wants.
A very important feature of this control is, that it can be used on most of the current browsers. It is tested with latest version of Mozilla, Internet Explorer and Opera. The look of the control is different on browsers that doesn't support filters (filters are supported only in newer versions of MSIE). You can also use HTML in lot of control properties, so you can get popup with icon or anything you want.
The control has two events,
LinkClicked (link in popup was clicked) and
(user clicked on 'X' button in popup). There are three ways how this events can be handled. The method that will
be used is determined by
ActionType property. There can be the following three types of actions:
MessageWindow(default) - If this action is selected, control will open new browser window with text specified by
Linkproperty). You can also change
targetattribute of generated
<A>tag. Generated code will look like this:
<a href="[Link]" target="[LinkTarget]">Link..</a>, so be careful when using quotes in
Targetattribute is added only when
LinkTargetisn't empty string.)
RaiseEvents- When you select this option, popup control will raise
PopupClosedevents on server-side.
Using this control
Adding the control to a web page is very simple. In VS.NET, you can just use Add/Remove Toolbox Items and select control's DLL file. Control will appear in toolbox and you can add it to a page.
Control has rich support for designer, so you can change every property of control at design-time. In category 'Action',
you can define what the control should do when user clicks on link or closes popup element. Properties in categories
'Texts' and 'Design' allow you to modify control look and displayed messages. In 'Behavior', you can change timing
(when popup will be displayed and hidden).
AutoShow property indicates whether control will be displayed
after page is loaded. This is useful when you want to show control later using Anchor control. If you set
true, user can change control's position and move it on the page. 'Window' category allows you to
change properties of window that will appear if you set
Last properties are added to category 'Layout' and it makes possible to modify position, where window will be
displayed (offsets from bottom-left or bottom-right window corner).
Following code describes how to change a few properties and show popup control from code:
<!-- 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// Change action type popupWin.ActionType=EeekSoft.Web.PopupAction.MessageWindow; // Set popup and window texts popupWin.Title="This is popup"; popupWin.Message="<i>Message</i> displayed in popup"; popupWin.Text="Text to show in new window.."; // Change color style popupWin.ColorStyle=EeekSoft.Web.PopupColorStyle.Green; // Change timing popupWin.HideAfter=5000; popupWin.ShowAfter=500; // Show popup (after page is loaded) popupWin.Visible=true;
Using anchor control
Adding anchor control to page at design-time is similar as adding popup control. When you add anchor to page, you can
select ID of existing server-side control, or write ID of any other element, and choose its client-side event you want
to handle. If you want to only reopen popup, you don't need to do anything else. You only have to ensure that popup
window control will be rendered to output page (it must be visible). If you don't want to open popup when page is
false and popup will open after specified event occurs.
You can also change texts on popup control using
PopupWinAnchor. To do this, set property
of anchor control to
true. If this is selected, anchor control will change title of popup to
NewMessage and text in optional new browser window to
NewText, when client-side event is raised.
Following example shows how
PopupWinAnchor control can be used to reopen once closed popup control:
<!-- 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// Handle onclick event .. popupAnchor.HandledEvent="onclick"; // .. of spanReopen element popupAnchor.LinkedControl="spanReopen"; // Show popupWin when event occurs popupAnchor.PopupToShow="popupWin"; // Popup win is visible .. popupWin.Visible=true; // .. and will be displayed when page is loaded popupWin.AutoShow=true;
Creating control at runtime
There were problems with creating controls at runtime. This is fixed in latest version and here is an example
of how to create
PopupWinAnchor control at runtime. Following code
element. (This sample assumes, that you have an element called
spanReopen on your page).
// Create popup window and popup win anchor control (in Page_Load) PopupWin popupWin=new PopupWin(); PopupWinAnchor popupAnchor=new PopupWinAnchor(); // Add controls to page 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;
Who can use it ?
This control can be well used to notify users about important information. For example, in a web email client, you may want to notify the user about new message. In applications where users can communicate inside system, you can use this control to alert user, that someone wants to talk to him. Benefit of this control is, that it doesn't need any fixed space on web page and it is remarkable, so user will notice it. Another way of how to use it is to show advertising information in it instead of using big Flash animations (See online demo for CodeProject banner).
Anchor control makes it possible to use popup control faster and with less page reloading. For example, you can use popup control to show quick help on form fields like in this sample. Quick help is displayed when textbox receives focus. Another way of how to use it for quick help is to add button behind each textbox and when user clicks on this button, popup will be displayed.
- 20/04/2004 -
PopupSpeedadded (you can change sliding speed of popup window).
- 20/04/2004 - Few minor bugs fixed. Sample that shows how to generate controls at runtime added.
- 26/02/2004 -
ShowLinkproperty added (allows not to generate link in popup control).
- 11/30/2003 - DLL compiled both .NET 1.0 and .NET 1.1,
OpenLinkerror fixed, Drag & drop support, VB.NET sample added (1.2).
- 11/18/2003 -
PopupWinAnchoradded (1.1). Thanks to Oskar Austegard for his suggestion.
- 11/15/2003 - First version of article (Published at CodeProject.Com).
- RE: ASP.NET Popup Control by (2/22/2007 12:15:40 PM)
how to add sound when popup is added
- RE: Not working with update panel (Ajax) by Peter (3/13/2007 12:51:05 AM)
not working with AJAX
any idea ?
- RE: ASP.NET Popup Control by rakesh kapuriya (11/19/2007 8:41:43 AM)
can this control used to notify when some data has been changed without refreshing page??????
- RE: ASP.NET Popup Control by Phil (11/28/2007 5:40:37 PM)
Also, having trouble in an UPDATE PANEL. In various INFRAGISTICS controls developer needs to get the "embedded" control id by calling client side event for "Initialize" - but they expose the event.
Thx for any assistance.
- RE: ASP.NET Popup Control by Prakash Chauhan (1/10/2008 12:35:29 PM)
In update panel this control is now working
- RE: ASP.NET Popup Control by Anon (1/23/2008 9:00:10 PM)
Yup. This control is useless without ajax support.
- RE: ASP.NET Popup Control by Waseem Khan (4/7/2008 11:31:26 AM)
can u help me, How to handle File DownLoad Window which comes when a particular Link within HyperLinkField is clicked, Thanks
- RE: ASP.NET Popup Control by Manis (4/25/2008 11:02:15 AM)
How to Create Popup Control in toolbox, i added but Properties not working.. Help Me..
- RE: ASP.NET SiteMapPath Control by Bell (4/25/2008 11:08:44 AM)
Can U Send SiteMapPath Control Program....
- RE: ASP.NET Popup Control by Soran Singh (5/17/2008 9:24:02 AM)
I have tried it with vs 2005 in web application project written in vb.net but it does not work. I added the toolbox and reference of dll successfully. Set all the required properties as per sample, No error in design time or run time.
Hope I can get some help from this comment.
- RE: ASP.NET Popup Control by Soran Singh (5/18/2008 3:48:59 PM)
Sorry, It works in single ASP page but does not work if I try it in master/content asp page. Is there anyway to use it in master page?
- RE: ASP.NET Popup Control by Tomas (6/4/2008 2:13:34 AM)
Sorry for not replying to the questions regarding this article. This is no longer a maintained projet this wasn't desined for ASP.NET "Ajax" and I have no plans in realeasing new version currently.
- RE: ASP.NET Popup Control by (6/4/2008 8:57:52 AM)
- RE: ASP.NET Popup Control by rashmi (6/10/2008 10:37:56 AM)
can we use this in asp.net 1.1 without addeing ekSoft.Web
how can we make asp.net popup alerts
- RE: ASP.NET Popup Control by (6/12/2008 9:28:37 PM)
- RE: ASP.NET Popup Control by (6/28/2008 9:28:19 PM)
- RE: ASP.NET Popup Control by Massive (8/19/2008 11:26:13 AM)
I tried this, but I get an error saying element"control" not recognized tried it in VS 2005.
- RE: ASP.NET Popup Control by Massive (8/19/2008 11:27:55 AM)
I tried this, but I get an error saying element"control" not recognized tried it in VS 2005.
- RE: ASP.NET Popup Control by (10/21/2008 12:30:20 PM)
Its one of the good tool box component ..
thanks to tom
- RE: ASP.NET Popup Control by nitin (1/19/2009 9:18:27 AM)
how to show multiple messages in that control one by one
- RE: ASP.NET Popup Control by JonO (3/14/2009 5:21:00 PM)
It is a great control for a non-ajax project - ignore the idiots who whine. And thanks!
- RE: ASP.NET Popup Control by Hariom Thakur (3/17/2009 12:52:43 PM)
plz tell me how to raise only once time in my website.
- RE: ASP.NET Popup Control by amit singh (3/24/2009 7:57:19 AM)
hi i am working on chatting application i wana open a popup window on another side when a person sends a message to another can any one tel me how can i do so??
- RE: ASP.NET Popup Control by xyz (1/6/2010 10:19:50 AM)
here text seems to be in center how do i align it left?
- [Popup UserControl] Making it work with abstract and master pages : possible ? by claudetom (1/20/2010 6:15:58 PM)
How to use this popup through ASP pages that inherit an abstractPage and control it from a UserControl ?
My Popup is declared in MasterPage as all other pages inherit it.
For tests, if AutoShow = True, the popup appears correctly on the pages load.
The goals are :
- declaring the Popup Control once
- being able to control it with a button (or linkbutton) located in the UserControls that are displayed on pages : the button has to give paramaters to the popup
- RE: ASP.NET Popup Control by Madhu Ranjan (2/2/2010 4:24:41 PM)