An efficient way to refresh the parent page from child popup window

Problem : Let us think of a scenario :

Suppose we have a search page (A.aspx) which contains a tabular view of student data . The page contains a filter button to filter the students based on some condition . Initially the table contains all students data (say 100 records) . Now after pressing the filter button,the table has now only 25 records .

Again for each student row, we have a link to open its details where we can view/edit the student information. These are very common work we are doing for records management.

Now after editing the student details from popup, we always want to refresh the parent page to reflect the changes for that student. For this we can use the following scripts in window.onunload event :

window.opener.location.href = window.opener.location.href;
   window.opener.location.reload();

The problems with the above scripts are : 1) Every time when we close the child window, whether we have modified the student’s data or not, the parent page will be refreshed.

2) If the page refreshes, our searched records(25 records) will be lost and display back to default dataset of 100 records of the students.

Generally we are doing following things to get back the searched results after closing the child window
–> storing the filter values in cookies, sessions, hidden fields, or pass to and fro through the query string between the parent and child pages. Which causes overhead and hence performance is affected .

Solution : We can think of a simple logic to avoid such problem : – “if we can, by any means, click the parent page filter button” .

By doing this we can refresh the modified information of student and achieve the filtered results too.

We have the following script to do this in child page :

function RefreshParentPage() {
       window.opener.document.getElementById('btnSearchCriteria').click();
}

–> ‘btnFilterCriteria’ is the client id of the filter button of parent page (A.aspx).

Here we need one more thing to do in child page : The filter button first run the server side code to update the data to DB and then call the javascript function “RefreshParentPage”.

For this, we need to register the client script to the page dynamically as following :
Child popup page code behind :

protected void btnFilter_Click(object sender, EventArgs e)
{
     /* Do some select/Insert/Update operation
    .....
    .....
    .....
    */
    Page.ClientScript.RegisterStartupScript(this.GetType(), "RefreshParentPage", "RefreshParentPage();");
}

In this way we can stop unnecessary refreshment of the parent page after closing the child window and also we can get our filtered result back.