E
Earl Teigrob
I did a ton of searching to try and find a simple solution to this issue and finally wrote my own, which I am sharing with everyone. In my searching, I did find a very complete and robust solution at
http://weblogs.asp.net/asmith/archive/2003/09/15/27684.aspx
but it was far more complex then I needed. (I got lost trying to figure it all out). Therefore, here goes my simple "web dialog box with parent event handler fireing" solution.
Background
I have created a web application that uses configuation information held in a data store to alter the display charactoristics of a page. On the top of each page is a control panel that lets users change the configuation information in then save the data to the data store, and an event is fired that rebinds the page. This works fine but the Control Panel at the top of the page can use quite a bit on page real estate when it is open(visible). I thought if I could accomplish the same affect with a popup window, that would give the users a better experience.
Objectives
1. A very simple way of creating a button on the parent window that has a postback event associated with it.
2. When the parent window open button is clicked, a child window to be displayed and the event hander is not fired (at this time)
3. The child window would employ a button that would fire its event handler, (contitionally) fire the event handler of the parent opening button, and then (conditionally) close the itself (the child window)
4. Muliple parent "window open" buttons need to be able to be added to a page without conflicts.
Solution.
I created two custom buttons that inherit from the System.Web.UI. WebControls.Button control.
The WindowOpenButton goes on the parent file and sets the FileToOpen property to the name of the page to pop up into a window. When a user clicks on this button, it opens the file specified in the FileToOpen property, but does NOT fire the buttons event handler.
The ChildWindowButton goes in the child page file and captures the ID of the parent window button that opened its window. In the event handler of this button, the programmer must explicity call one of two methods to fire the event handler of the parent WindowOpenButton button. PostBackParentAndExitWindow() fires the event hander for the WindowOpenButton that opened this window but does NOT close the current child window. PostBackParent() fires the event hander for the WindowOpenButton that opened this window but does NOT close the current child window.
Here are the code files.
WindowOpenButton Control File
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.ComponentModel;
namespace PopupDialog
{
/// <summary>
/// Summary description for WindowOpenButton.
/// </summary>
[DefaultProperty("Text"),
ToolboxData("<{0}:WindowOpenButton runat=server></{0}:WindowOpenButton>")]
public class WindowOpenButton : System.Web.UI.WebControls.Button
{
public string FileToOpen
{
get
{
object x = ViewState["WindowToOpen"];
return x==null?"":Convert.ToString(x);
}
set
{
ViewState["WindowToOpen"] = value;
}
}
protected override void OnPreRender(EventArgs e)
{
this.Attributes.Add("onclick","javascript:window.open(\""+FileToOpen+"?clientid="+ this.ID +"\",\""+this.ID+"\",\"toolbar,width=500,height=500\");return false");
Page.RegisterStartupScript("PostBack_" + this.ID,"<Script Language=\"Javascript\">function PostBack_"+ this.ID +"() {"+Page.GetPostBackClientEvent(this,"")+"}</script>");
base.OnPreRender (e);
}
}
}
ChildWindowButton Control File
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.ComponentModel;
namespace PopupDialog
{
/// <summary>
/// Summary description for ChildWindowButton.
/// </summary>
[DefaultProperty("Text"),
ToolboxData("<{0}:ChildWindowButton runat=server></{0}:ChildWindowButton>")]
public class ChildWindowButton : System.Web.UI.WebControls.Button
{
public string WindowOpenButtonClientId
{
get
{
object x = ViewState["WindowOpenButtonClientId"];
return x==null?null:Convert.ToString(x);
}
set
{
ViewState["WindowOpenButtonClientId"] = value;
}
}
public void PostBackParentAndExitWindow()
{
Page.RegisterStartupScript("ParentPostback","<Script Language=\"Javascript\">window.opener.PostBack_" + this.WindowOpenButtonClientId + "();window.close();</script>");
}
public void PostBackParent()
{
Page.RegisterStartupScript("ParentPostback","<Script Language=\"Javascript\">window.opener.PostBack_" + this.WindowOpenButtonClientId + "();</script>");
}
protected override void OnPreRender(EventArgs e)
{
WindowOpenButtonClientId=Page.Request["ClientId"];
base.OnPreRender (e);
}
}
}
In this sample a session variable Session["Data"] is used to represent a data store,. When the Child Window comes up, the user can enter some text into the text box and it will be stored in the session variable. The event hander of the parent will then run the DataBindPage method to display the value on its page.
ParentPage.aspx
<form id="Form1" method="post" runat="server">
<cc1:windowopenbutton id="WindowOpenButton1" runat="server" FileToOpen="popup.aspx" Text="Open Window 1 Button"></cc1:windowopenbutton>
<BR>
PAGE TEXT
<br>
<asp:literal id="Literal1" runat="server"></asp:literal></P>
</form>
ParentPage.aspx.cs CodeBehind
protected WindowOpenButton WindowOpenButton1;
protected System.Web.UI.WebControls.Literal Literal1;
private void Page_Load(object sender, System.EventArgs e)
{
if (!Page.IsPostBack)
{
DataBindPage();
}
}
private void DataBindPage()
{
object o = Session["Data"];
Literal1.Text = (o==null)?""
string)o;
}
#region Web Form Designer generated code
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: This call is required by the ASP.NET Web Form Designer.
//
InitializeComponent();
base.OnInit(e);
}
private void InitializeComponent()
{
this.WindowOpenButton1.Click += new System.EventHandler(this.WindowOpenButton1_Click);
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
private void WindowOpenButton1_Click(object sender, EventArgs e)
{
DataBindPage();
}
Popup.aspx Popup Window Page
<form id="Form1" method="post" runat="server">
<P>POPUP WINDOW</P>
<P>Data :
<asp:TextBox id="TextBox1" runat="server"></asp:TextBox></P>
<P><cc1:ChildWindowButton id="ChildWindowButton1" Text="Local Postback Only" runat="server" /></P>
<P><cc1:ChildWindowButton id="ChildWindowButton2" Text="PostBack Parent but Keep this Window Open" runat="server" /></P>
<P><cc1:ChildWindowButton id="ChildWindowButton3" Text="Postback Pareent and Close Window" runat="server" /></P>
<P> </P>
<P>
<asp:Literal id="Literal2" runat="server"></asp:Literal></P>
</form>
Popup.aspx.cs Code Behind
protected System.Web.UI.WebControls.Literal Literal2;
protected ChildWindowButton ChildWindowButton1;
protected ChildWindowButton ChildWindowButton2;
protected System.Web.UI.WebControls.TextBox TextBox1;
protected ChildWindowButton ChildWindowButton3;
private void Page_Load(object sender, System.EventArgs e)
{
//ChildCloseWithPostbackButton1.WindowOpenButtonClientId=Request["ClientId"];
}
#region Web Form Designer generated code
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: This call is required by the ASP.NET Web Form Designer.
//
InitializeComponent();
base.OnInit(e);
}
/// <summary>
/// Required method for Designer support - do not modify
/// the contents of this method with the code editor.
/// </summary>
private void InitializeComponent()
{
this.ChildWindowButton1.Click += new System.EventHandler(this.ChildWindowButton1_Click);
this.ChildWindowButton2.Click += new System.EventHandler(this.ChildWindowButton2_Click);
this.ChildWindowButton3.Click += new System.EventHandler(this.ChildWindowButton3_Click);
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
private void ChildWindowButton1_Click(object sender, EventArgs e)
{
Session["Data"]=TextBox1.Text;
Literal2.Text = "This is local postback only";
}
private void ChildWindowButton2_Click(object sender, EventArgs e)
{
Session["Data"]=TextBox1.Text;
Literal2.Text = "This does Postback Parent (For Apply Button)";
ChildWindowButton2.PostBackParent();
}
private void ChildWindowButton3_Click(object sender, EventArgs e)
{
Session["Data"]=TextBox1.Text;
Literal2.Text = "This does Postback Parent and Close Window";
ChildWindowButton3.PostBackParentAndExitWindow();
}
If you have any comments or suggestions, please let me know
Earl
http://weblogs.asp.net/asmith/archive/2003/09/15/27684.aspx
but it was far more complex then I needed. (I got lost trying to figure it all out). Therefore, here goes my simple "web dialog box with parent event handler fireing" solution.
Background
I have created a web application that uses configuation information held in a data store to alter the display charactoristics of a page. On the top of each page is a control panel that lets users change the configuation information in then save the data to the data store, and an event is fired that rebinds the page. This works fine but the Control Panel at the top of the page can use quite a bit on page real estate when it is open(visible). I thought if I could accomplish the same affect with a popup window, that would give the users a better experience.
Objectives
1. A very simple way of creating a button on the parent window that has a postback event associated with it.
2. When the parent window open button is clicked, a child window to be displayed and the event hander is not fired (at this time)
3. The child window would employ a button that would fire its event handler, (contitionally) fire the event handler of the parent opening button, and then (conditionally) close the itself (the child window)
4. Muliple parent "window open" buttons need to be able to be added to a page without conflicts.
Solution.
I created two custom buttons that inherit from the System.Web.UI. WebControls.Button control.
The WindowOpenButton goes on the parent file and sets the FileToOpen property to the name of the page to pop up into a window. When a user clicks on this button, it opens the file specified in the FileToOpen property, but does NOT fire the buttons event handler.
The ChildWindowButton goes in the child page file and captures the ID of the parent window button that opened its window. In the event handler of this button, the programmer must explicity call one of two methods to fire the event handler of the parent WindowOpenButton button. PostBackParentAndExitWindow() fires the event hander for the WindowOpenButton that opened this window but does NOT close the current child window. PostBackParent() fires the event hander for the WindowOpenButton that opened this window but does NOT close the current child window.
Here are the code files.
WindowOpenButton Control File
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.ComponentModel;
namespace PopupDialog
{
/// <summary>
/// Summary description for WindowOpenButton.
/// </summary>
[DefaultProperty("Text"),
ToolboxData("<{0}:WindowOpenButton runat=server></{0}:WindowOpenButton>")]
public class WindowOpenButton : System.Web.UI.WebControls.Button
{
public string FileToOpen
{
get
{
object x = ViewState["WindowToOpen"];
return x==null?"":Convert.ToString(x);
}
set
{
ViewState["WindowToOpen"] = value;
}
}
protected override void OnPreRender(EventArgs e)
{
this.Attributes.Add("onclick","javascript:window.open(\""+FileToOpen+"?clientid="+ this.ID +"\",\""+this.ID+"\",\"toolbar,width=500,height=500\");return false");
Page.RegisterStartupScript("PostBack_" + this.ID,"<Script Language=\"Javascript\">function PostBack_"+ this.ID +"() {"+Page.GetPostBackClientEvent(this,"")+"}</script>");
base.OnPreRender (e);
}
}
}
ChildWindowButton Control File
using System;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.ComponentModel;
namespace PopupDialog
{
/// <summary>
/// Summary description for ChildWindowButton.
/// </summary>
[DefaultProperty("Text"),
ToolboxData("<{0}:ChildWindowButton runat=server></{0}:ChildWindowButton>")]
public class ChildWindowButton : System.Web.UI.WebControls.Button
{
public string WindowOpenButtonClientId
{
get
{
object x = ViewState["WindowOpenButtonClientId"];
return x==null?null:Convert.ToString(x);
}
set
{
ViewState["WindowOpenButtonClientId"] = value;
}
}
public void PostBackParentAndExitWindow()
{
Page.RegisterStartupScript("ParentPostback","<Script Language=\"Javascript\">window.opener.PostBack_" + this.WindowOpenButtonClientId + "();window.close();</script>");
}
public void PostBackParent()
{
Page.RegisterStartupScript("ParentPostback","<Script Language=\"Javascript\">window.opener.PostBack_" + this.WindowOpenButtonClientId + "();</script>");
}
protected override void OnPreRender(EventArgs e)
{
WindowOpenButtonClientId=Page.Request["ClientId"];
base.OnPreRender (e);
}
}
}
In this sample a session variable Session["Data"] is used to represent a data store,. When the Child Window comes up, the user can enter some text into the text box and it will be stored in the session variable. The event hander of the parent will then run the DataBindPage method to display the value on its page.
ParentPage.aspx
<form id="Form1" method="post" runat="server">
<cc1:windowopenbutton id="WindowOpenButton1" runat="server" FileToOpen="popup.aspx" Text="Open Window 1 Button"></cc1:windowopenbutton>
<BR>
PAGE TEXT
<br>
<asp:literal id="Literal1" runat="server"></asp:literal></P>
</form>
ParentPage.aspx.cs CodeBehind
protected WindowOpenButton WindowOpenButton1;
protected System.Web.UI.WebControls.Literal Literal1;
private void Page_Load(object sender, System.EventArgs e)
{
if (!Page.IsPostBack)
{
DataBindPage();
}
}
private void DataBindPage()
{
object o = Session["Data"];
Literal1.Text = (o==null)?""
string)o; }
#region Web Form Designer generated code
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: This call is required by the ASP.NET Web Form Designer.
//
InitializeComponent();
base.OnInit(e);
}
private void InitializeComponent()
{
this.WindowOpenButton1.Click += new System.EventHandler(this.WindowOpenButton1_Click);
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
private void WindowOpenButton1_Click(object sender, EventArgs e)
{
DataBindPage();
}
Popup.aspx Popup Window Page
<form id="Form1" method="post" runat="server">
<P>POPUP WINDOW</P>
<P>Data :
<asp:TextBox id="TextBox1" runat="server"></asp:TextBox></P>
<P><cc1:ChildWindowButton id="ChildWindowButton1" Text="Local Postback Only" runat="server" /></P>
<P><cc1:ChildWindowButton id="ChildWindowButton2" Text="PostBack Parent but Keep this Window Open" runat="server" /></P>
<P><cc1:ChildWindowButton id="ChildWindowButton3" Text="Postback Pareent and Close Window" runat="server" /></P>
<P> </P>
<P>
<asp:Literal id="Literal2" runat="server"></asp:Literal></P>
</form>
Popup.aspx.cs Code Behind
protected System.Web.UI.WebControls.Literal Literal2;
protected ChildWindowButton ChildWindowButton1;
protected ChildWindowButton ChildWindowButton2;
protected System.Web.UI.WebControls.TextBox TextBox1;
protected ChildWindowButton ChildWindowButton3;
private void Page_Load(object sender, System.EventArgs e)
{
//ChildCloseWithPostbackButton1.WindowOpenButtonClientId=Request["ClientId"];
}
#region Web Form Designer generated code
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: This call is required by the ASP.NET Web Form Designer.
//
InitializeComponent();
base.OnInit(e);
}
/// <summary>
/// Required method for Designer support - do not modify
/// the contents of this method with the code editor.
/// </summary>
private void InitializeComponent()
{
this.ChildWindowButton1.Click += new System.EventHandler(this.ChildWindowButton1_Click);
this.ChildWindowButton2.Click += new System.EventHandler(this.ChildWindowButton2_Click);
this.ChildWindowButton3.Click += new System.EventHandler(this.ChildWindowButton3_Click);
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
private void ChildWindowButton1_Click(object sender, EventArgs e)
{
Session["Data"]=TextBox1.Text;
Literal2.Text = "This is local postback only";
}
private void ChildWindowButton2_Click(object sender, EventArgs e)
{
Session["Data"]=TextBox1.Text;
Literal2.Text = "This does Postback Parent (For Apply Button)";
ChildWindowButton2.PostBackParent();
}
private void ChildWindowButton3_Click(object sender, EventArgs e)
{
Session["Data"]=TextBox1.Text;
Literal2.Text = "This does Postback Parent and Close Window";
ChildWindowButton3.PostBackParentAndExitWindow();
}
If you have any comments or suggestions, please let me know
Earl