?
Solved

Html popup window reload issue

Posted on 2013-01-22
3
Medium Priority
?
576 Views
Last Modified: 2013-01-23
Hi Experts,
 
Please help the issue below. Thanks!

I have a html popup window which is opened from a main html page.
Data will be passed from main page to popup for it to render.

in main page:
var dataRetrievedFromServer = "Data retrieved from Server";
popupWindow = window.open("popupPage.html", "New window name");
popupWindow.dataRetrievedFromServer = dataRetrievedFromServer;

in popupPage.html

alert(dataRetrievedFromServer);

popupPage.html works for the first time when it is called from main page.
The problem is that I can not "refresh" popupPage.html after loaded. (e.g. F5).
Since the popupPage.html need data "dataRetrievedFromServer" to render the page,
so I try to use localStorage or sessionStorage to save the data passed from main page at the initial loading.
(code below). It works for the else statement. not the if route.
            if (dataRetrievedFromServer == null || dataRetrievedFromServer == "undefined"){            
                  dataRetrievedFromServer = localStorage.dataRetrievedFromServer;
                  alert("dataRetrievedFromServer is null  or undefined");
            }
            else{
                  localStorage.dataRetrievedFromServer = dataRetrievedFromServer;      
                  alert("dataRetrievedFromServer is populated.");
            }

a short history about it. The popup page used to be written in jsp, which the data can be retrieved from session. Reload the popup page is not a problem. I need convert the pupup page into html page. Then the issue comes up.
0
Comment
Question by:SarahDeng
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
3 Comments
 
LVL 34

Accepted Solution

by:
Slick812 earned 1200 total points
ID: 38810895
greetings  SarahDeng, , , from your description of problem, you may be getting your "pop-up" page var dataRetrievedFromServer in the wrong direction, you set it when you create the pop-up, what I would do is NOT set it in another window (page) javascript , but get it in the pop-up page javascript, from the main (first) window, , , this is some suggested code, I can not test it now , but may work-

var dataRetrievedFromServer = "Data retrieved from Server";
window.name = 'main1'; // make sure the ajax window has a name property
popupWindow = window.open("popupPage.html", "pop1");
//pop1.dataRetrievedFromServer = dataRetrievedFromServer; do not set here

Open in new window


and on pop-up page javascript -
// setting local dataRetrievedFromServer need to happen in the onload event
var dataRetrievedFromServer = main1.dataRetrievedFromServer;
alert(dataRetrievedFromServer); // to prevent confusing variable names in main and pop-up, use different suffix in each

Open in new window


although, what I might actually do since these are separate windows is to have the AJAX get the server data in the javascript on the pop-up page

also since many browsers now block those pesky pop-up windows, the old  window.open( )  methods have now gone to a "Cover" type of <div> display in the main window?
0
 
LVL 51

Assisted Solution

by:ahoffmann
ahoffmann earned 800 total points
ID: 38811455
I'm also wondering that your script works as described, I guess that you're just lucky to see anything from your dataRetrievedFromServer

the problem is the sequence

> popupWindow = window.open("popupPage.html", "New window name");
> popupWindow.dataRetrievedFromServer = dataRetrievedFromServer;

which sets the data for your popup window after it is created
hence it will only work if rendering pupupPage.html is not yet finished when popupWindow.dataRetrievedFromServer is set

I suggest that you use a function inside popupPage.html which loads (and renders) data from popupWindow.dataRetrievedFromServer
this function must be called with a delay, for example with setTimeout()
then you can also call that function again to refresh the page
0
 

Author Comment

by:SarahDeng
ID: 38812488
Thanks for all answers. I think I will make a separate Ajax call from popup Page to retrieve data. It will make refresh work.
0

Featured Post

WordPress Tutorial 1: Installation & Setup

WordPress is a very popular option for running your web site and can be used to get your content online quickly for the world to see. This guide will walk you through installing the WordPress server software and the initial setup process.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses four methods for overlaying images in a container on a web page
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

771 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question