Tuesday, June 1, 2010

Passing value and auto refresh parent window from popup

Here I will show how to pass value from popup window to parent window and refresh parent window while closing popup. This is a common task and often asked in asp.net forum. In this example, I have taken two forms:

Default4.aspx >Its Master page is  MasterPage.master (This is parent page)
Default5.aspx (This is child page)

I have taken UpdatePanel in parent page to check whether it is working properly with UpdatePanel. Let us see codes of Default4.aspx:

HTML:


<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true"
    CodeFile="Default4.aspx.cs" Inherits="Default4" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">

    <script type="text/javascript">
        function OpenPopup() {
            window.open("Default5.aspx", "Popup", "scrollbars=no,resizable=no,width=500,height=250");
            return false;
        }
    script>

asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <div>
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <div>
                    <table width="80%">
                        <tr>
                            <td>
                                <asp:Label ID="Label1" runat="server" Text="Value from popup:">asp:Label>
                            td>
                            <td>
                                <asp:TextBox ID="txtOpenner" runat="server">asp:TextBox>
                                 <asp:Button ID="Button1" runat="server" Text="Popup" OnClientClick="OpenPopup()" />
                                <asp:Label ID="Label2" runat="server" Text="">asp:Label>
                            td>
                        tr>
                    table>
                div>
            ContentTemplate>
        asp:UpdatePanel>
    div>
asp:Content>

Design preview: 


When user click on Popup button popup window will be displayed and the textbox will show value sent from popup window.

Code behind:


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class Default4 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        int count = 0;
        if (!IsPostBack)
        {
            Session["Count"] = 0;
        }
        if (IsPostBack)
        {
            Session["Count"] = count = int.Parse(Session["Count"].ToString())+1;
            Label2.Text = "This page is postedback " + count.ToString() + " times";
        }
    }
}


Here I am counting how many time PostBack event is occurring in parent page and showing in Label2. I am doing this to clearly understand that parent page is refreshed clearly.



Now, Let us see codes of Default5.aspx:

HTML:



<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default5.aspx.cs" Inherits="Default5" %>

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>title>

    <script language="javascript" type="text/javascript">

        function SendValue() {
            var val = document.getElementById('<%=TextBox1.ClientID%>').value;
            window.opener.document.getElementById("ctl00_ContentPlaceHolder1_txtOpenner").value = val;
            window.close();
            window.opener.document.forms(0).submit();
        }

    script>

head>
<body>
    <form id="form1" runat="server">
    <div>
        <table width="100%">
            <tr>
                <td>
                    <asp:Label ID="Label1" runat="server" Text="Give your name here:">asp:Label>
                td>
                <td>
                    <asp:TextBox ID="TextBox1" runat="server">asp:TextBox>
                     <asp:Button ID="btnSend" runat="server" Text="Send to opener" OnClientClick="SendValue()" />
                td>
            tr>
        table>
    div>
    form>
body>
html>

Code behind:



using System;

public partial class Default5 : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
}

Earn money from Freelancer.com:

Freelance Jobs

1 comment:

  1. It would be very helpful if I get same functionality in ASP .NET MVC. I could not reproduce same effect in mvc application.

    Thanks
    Prakash Bhatta

    ReplyDelete