Accessing JavaScript array on parent page

I have a page whose onload init creates an array and puts some values into it:

<script type="text/javascript">
    var order = [];
       
    window.onload = init;

    function init() {
        order[0] = "red".
        order[1] = "blue";
    }

Later in the body I open a popup window and load an html page into it by calling the JavaScript below::

    function open_sw1() {
    sw1 = window.open("sw1.html", "sw1", "width=380, height=400, left=655, top=435");
}

Now from JavaScript in  sw1.html I want to access the array I created on the parent page.  I tried this:

        alert("parent array: " + window.opener.order[0] + window.opener.order[1]);

but that doesn't work, and I guess it shouldn't since the array is not part of the DOM.

Does anyone have any ideas on the best way to do this?

Thanks

stevaAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

hieloCommented:
on the parent page try creating a function that will return said array:
function getArray(){
return order;
}

then on the popup try invoking the function first:
var myData = self.opener.getArray();
alert(myData[0])
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
stevaAuthor Commented:
It seems like that should work, but it doesn't.  On the parent page I have:

<script type="text/javascript">
    var order = [];
       
    window.onload = init;

    function init() {
        order[0] = "red".
        order[1] = "blue";
    }

 function getArray() {
       alert("getArray");
        return order;
    }
</script>

On the popup I have:

var myData = self.opener.getArray();
        alert("parent array: " + myData[0] + " " + myData[1]);

And the popup alert says : "parent array: undefined undefined"

I also notice that the popup on the parent page for getArray() doesn't fire.

Thanks for your help
0
stevaAuthor Commented:
I mean, " the alert on the parent page for getArray() doesn't fire."
0
Determine the Perfect Price for Your IT Services

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden with our free interactive tool and use it to determine the right price for your IT services. Download your free eBook now!

hieloCommented:
see if the browser is reporting syntax errors anywhere else. What I suggested works for me.
window.load=function(){
  var myData = self.opener.getArray();
        alert("parent array: " + myData[0] + " " + myData[1]);
};

Open in new window

0
stevaAuthor Commented:
Ok, it's working here too. Silly error.

But one question:  When we execute

                                         var myData = self.opener.getArray();

from the popup are we bringing the actual array into the popup or just a pointer to the array?  More specifically, if I change the array in the popup code is the array changed automatically in the parent, and if I push a new record onto myData[]  in  the popup does order[] get the new record automatically?

Thanks again.
0
stevaAuthor Commented:
Found the answer to my last question here:    http://www.hunlock.com/blogs/Mastering_Javascript_Arrays

Javascript Arrays Are Passed By Reference
Arrays are passed to functions by reference, or as a pointer to the original. This means anything you do to the Array inside the function affects the original.

Thanks.  I gave you the points.
0
hieloCommented:
>>if I change the array in the popup code is the array changed automatically in the parent,
Yes

parent.html
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
    var order = [];
       
    window.onload = init;

    function init() {
        order[0] = "red";
        order[1] = "blue";
    }

 function getArray() {
        return order;
    }
    
 function showArray(){
 	alert(order.join("\n"))
 }
</script>

</head>
<body>
<a href="#" onclick='window.open("child.html","childWin","width=500,height=400")'>Child</a>
</body>
</html>


child.html
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script language="JavaScript" type="text/javascript">
<!--
function report(){
	var myData = self.opener.getArray();
	alert(myData[0]);
	
	//here you are overwriting the contents of the first array element
	myData[0]='orange';

	//invoke the function in the parent page to see the contents of the array
	self.opener.showArray()
}
//-->
</script>

</head>
<body>
<a href="#" onclick='report()'>Report</a>
</body>
</html>

Open in new window

0
stevaAuthor Commented:
Thanks for the code example.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.