This may seem like a JavaScript 101 topic but this was currently something I struggled with the last couple of days, and I thought that if finding a solution for this task was hard for me then it might also be hard for other people.

What I was looking to do was this: Open a new window (child) that displays data that are passed from the initial window (parent).

I was able to find solutions on how to read values out of textboxes between the parent window and the child, but that would not work for me. I need to be able to pass arrays of objects and other values that are too big or just won’t fit in a textbox.

Here is the solution I came up with:

In the parent window before you call window.open() to create a new browser window/tab you need to create a new property on the window object.
window.foo = arrOfObjects;
window.open( ‘newWindowToShow.html’, ” );

Now to access the new property in the child window, you just need to reference the window.opener object.
var myNewListOfObjects = window.opener.foo;

That’s it. Now in the your new (child) window/tab you will have access to you values.

Make sure that when you are done using the values in your new window that you set the values to null. I noticed some issue when I didn’t do that.
window.opener.foo = null;

There is nothing more annoying than trying to understand code that is impossible to read. Different developers have different ways of writing code and these differences cost time when new developers to a project need to understand whats going on.

One practice that I push developers on my teams to follow is to write code so that it seems like one developer wrote it. I have come across a best practice document, idiomatic, that many developers and myself use.

To add this to your Eclipse environment:

  1. Go to Windows -> Preferences -> JavaScript -> Code Style -> Formatter
  2. Click Import and navigate to the idiomatic.xml file (attached in email)
  3. Click Apply then Ok

To apply the filter on your page you can press Ctrl+Shift+F. You can also set it up so that the filtering happens automatically on save. To do this:

  1. Go to Windows -> Preferences -> JavaScript -> Code Style -> Editor -> Save Actions
  2. Check the first 2 checkboxes

You can download it here: idiomatic.xml