Returning values from the Popup Window

Hi.... There are many situations wherein you have to open a popup and ask user to input some values in it and then return these values back to the parent window from which the popup was called.


Heres a simple example illustrating the basic things to be followed in order to get the values from popup window to the parent window. There are two pages here
1. ParentWindow.aspx
2.PopUpWindow.aspx
The inline code for the ParentWindow.aspx is as follows....
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ParentWindow.aspx.cs" Inherits="ContactManager.JavaScript.ExampleValidate" %><!
<
<DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">html xmlns="http://www.w3.org/1999/xhtml">head runat="server">
</
<<title>Parent Window</title>head>body><form id="form1" runat="server"><div><asp:Button ID="btnPopUp" runat="server" Text="Click to POP" OnClientClick="javascript:openPopup('../Javascript/PopUpWindow.aspx')" /><br /><label>Name:</label><asp:Label ID="lblName" runat="server"></asp:Label><br /><label>Email:</label><asp:Label ID="lblEmail" runat="server"></asp:Label><br /><label>URL:</label><asp:Label ID="lblUrl" runat="server"></asp:Label><br /><label>Zip:</label><asp:Label ID="lblZip" runat="server"></asp:Label><br /><label>Price:</label><asp:Label ID="lblPrice" runat="server"></asp:Label></div></form><pre> <
function
{
window.open(strOpen,
} script language="javascript" type="text/javascript"> openPopup(strOpen)"ViewPopUp","menubar=no,toolbar=0,scrollbars=0 resizable=yes height=200 width=500");</
</
</
</

Heres the code for the PopUp Window:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="PopUpWindow.aspx.cs" Inherits="ContactManager.JavaScript.PopUpWindow" %><!
<
<DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">html xmlns="http://www.w3.org/1999/xhtml" >head runat="server"><title>Enter the Details</title><script type="text/javascript" language="javascript">
{
window.opener.document.getElementById(
window.opener.document.getElementById(
window.opener.document.getElementById(
window.opener.document.getElementById(
window.opener.document.getElementById(
window.close();
self.close();

}

{
window.close();
}function btnSelect_OnClick()"lblName").innerText = document.getElementById("<%=txtName.ClientID%>").value;"lblEmail").innerText = document.getElementById("<%=txtEmail.ClientID%>").value;"lblUrl").innerText = document.getElementById("<%=txtUrl.ClientID%>").value;"lblZip").innerText = document.getElementById("<%=txtZip.ClientID%>").value;"lblPrice").innerText = document.getElementById("<%=txtPrice.ClientID%>").value;function btnCancel_OnClick()</
</
<script>head>body><form id="form1" runat="server"><div><asp:Label ID="lblHeading" runat="server" Text="Please enter the following details:" Font-Bold="true" Font-Size="Medium"></asp:Label><asp:Panel ID="pnl" runat="server" BorderStyle="Ridge" Width="450px"><table><tr><td><asp:Label ID="lblName" runat="server" Text="Name:"></asp:Label></td><td><asp:TextBox ID="txtName" runat="server" /> </td><td><asp:Label ID="lblEmail" runat="server" Text="Email:"></asp:Label></td><td><asp:TextBox ID="txtEmail" runat="server" /> </td></tr><tr><td><asp:Label ID="lblUrl" runat="server" Text="WebUrl:"></asp:Label></td><td><asp:TextBox ID="txtUrl" runat="server" /> </td>
<td><asp:Label ID="lblZip" runat="server" Text="Zip:"></asp:Label></td><td><asp:TextBox ID="txtZip" runat="server" /> </td></tr><tr><td><asp:Label ID="lblPrice" runat="server" Text="Price:"></asp:Label></td><td><asp:TextBox ID="txtPrice" runat="server" /></td></tr><tr><td><asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClientClick="javascript:btnSelect_OnClick()" /></td><td></td><td> <input type ="button" id="btnCancel" value="Close" runat="server" onclick="javascript:btnCancel_OnClick()" /></td></tr></table></asp:Panel></div>
</
</

And finally the output would look like this ......

Hope this example would help you...
Happy Coding !!!!
</form>body>html>The PopUp Window would look like this.....script>pre>body>html>

The Window looks like this