Automaticaly refresh parent window after popup is closed in .NET


Information
For data driven web application most of the times we did this job. There are lot of way to handle this issue. Here i am trying to show you few process that how we can handle it. To describe this problem here i am using datatable instead of database since anyone can replace my code easily by his own data reader block. Let we have a requirement that a page contains list of suppliers. Below the supplier list client wants to add a link to add more suppliers like:
If user click on add more supplier link then the link open a popup to enter supplier details. After entering the supplier details when user click on the save button then system automatically save the data & close the popup as well as reflect the currently added row to the opener like:

So now we can start step by step. At first add a page named parentrefresh.aspx. Then add a gridview to display the existing suppliers. After the gridview we need to add a link button/html button to popup the window. So parentrefresh.aspx looks like:
<b>List of suppliers:</b>

<asp:GridView runat="server" ID="gvEdit" DataKeyNames="ID" AutoGenerateColumns="false" ">
<Columns>
<asp:BoundField DataField="Code" HeaderText="Code"></asp:BoundField>
<asp:BoundField DataField="Name" HeaderText="Name"></asp:BoundField>
<asp:BoundField DataField="Address" HeaderText="Address"></asp:BoundField>
<asp:BoundField DataField="Contact" HeaderText="Contact no"></asp:BoundField>
</Columns>
</asp:GridView>

<asp:LinkButton runat="server" OnClientClick="window.open('childrefresh.aspx');return false;"
ID="lnkNew">Add more supplier
</asp:LinkButton>

To read existing supplier data from database(here i use datatable for simplicity) we need to write few server side code in page load event. Codes:
if (!IsPostBack)
{
DataTable dtSupplier;
if (Session["dtSupplier"]==null)
{
//If not populated previously then we need to populate data. Otherwise we read from session.
dtSupplier = new DataTable("Supplier");
dtSupplier.Columns.Add(new DataColumn("ID", System.Type.GetType("System.UInt64")));
dtSupplier.Columns.Add(new DataColumn("Code"));
dtSupplier.Columns.Add(new DataColumn("Name"));
dtSupplier.Columns.Add(new DataColumn("Address"));
dtSupplier.Columns.Add(new DataColumn("Contact"));
dtSupplier.Rows.Add(1, "st0001", "S.R. Steel", "Uttara, Dhaka", "01711xxxxxx");
dtSupplier.Rows.Add(2, "ir0039", "Shadesh builders", "Rampura, Dhaka", "01711yyyyyy");
dtSupplier.Rows.Add(3, "cr0042", "Orchard confec.", "Shahabag, Dhaka", "01711zzzzzz");
dtSupplier.Rows.Add(4, "er0078", "Windblow", "Mirpur, Dhaka", "01711qqqqqq");
dtSupplier.Rows.Add(5, "bd0301", "Rahimkarim", "Badda, Dhaka", "01711oooooo");
Session["dtSupplier"] = dtSupplier;
}
else
dtSupplier = (DataTable)Session["dtSupplier"];
gvEdit.DataSource = dtSupplier;
gvEdit.DataBind();
}

Now we need to add another page named childrefresh.aspx which will be our popup window. If you look at the first page link button click event then you found this page url as a popup. Find the child page html contents from below:

The onunload event basically refresh the parent page. Here you can refresh parent page by location or reload by using onunload="window.opener.location.reload();"
Or you can call a javascript function within onunload handler. Initially start with below code. After than practice above ways.
<body onunload="window.opener.location=window.opener.location;">
<form id="form1" runat="server">
<div>
<table border="0">
<tr><td>Code:</td><td>
<asp:TextBox runat="server" ID="txtCode"></asp:TextBox></td></tr>
<tr><td>Name:</td><td>
<asp:TextBox runat="server" ID="txtName"></asp:TextBox>
</td></tr>
<tr><td>Address:</td><td>
<asp:TextBox runat="server" ID="txtAddress"></asp:TextBox></td></tr><tr><td>Contact no:</td><td>
<asp:TextBox runat="server" ID="txtContact"></asp:TextBox></td>
</tr>
</table>
</div>
<asp:LinkButton runat="server" ID="lnkSave" OnClick="lnkSave_Click">Save & close</asp:LinkButton>

Now we need to write few code under save button to add supplier data in session datatable so parent page can read the currently saved data:
protected void Page_Load(object sender, EventArgs e)
{
//session time may be expired/user may open the popup directly other wise page gives error.
if (Session["dtSupplier"] == null)
return;
}

protected void lnkSave_Click(object sender, EventArgs e)
{
DataTable dtSupplier = (DataTable)Session["dtSupplier"];
dtSupplier.Rows.Add(1, txtCode.Text, txtName.Text, txtAddress.Text, txtContact.Text);
Session["dtSupplier"] = dtSupplier;
//below line register the close block in the page which will run imediately & close the popup.
ClientScript.RegisterStartupScript(GetType(),"tst", "<script>window.close();</script>");
}

Now our example is ready. Just run...........

0 comments:

Post a Comment

Subscribe to: Post Comments (Atom)