Home > Uncategorized, Web Applications > Opening New Browser Windows Part 1

Opening New Browser Windows Part 1

I currently have to open a new window in a web application. Here are my requirements:

  1. Must be browser compatible for IE6/7/8, Firefox (all), Opera (all), Chrome and Safari
  2. Must pass parameters to the new page (without using URL parameters)
  3. Must return a value to the old page
  4. Must know whether a window has already be opened, so only 1 is open at a time

According to this site, the target attribute for the anchor tag is being phased out. Therefore it is a better idea to use DOM in javascript to open the window. We need this anyway to meet the requirements for holding on to the new window reference.

I tried the first code example from this site, however it did not work in IE 7. I think a majority of this code is the correct way to go, so I need to work out why it failed in IE 7. I also noticed the resizable config setting had no effect in any of the browsers. That is fine, as this does not break any of the requirements.

I came across an interesting paragraph on the MSDN site, that mentions IE 7 in Windows Vista has access restrictions across process boundaries. It also mentions that when a new window is opened, it creates a new process. This may be an issue as it will make our requirements more difficult to meet.

The issue with IE 7 was related to the title text. I passed in a parameter like so:


function openWindow(url, title)
{
var win = window.open(url, ‘App - ‘ + title, config=”…”);
}

When I simply used:

var win = window.open(url, ‘App’, config=”…”);

Internet Explorer worked fine.

The resizable config setting appears to only work in Internet Explorer. I want consistent behaviour so I will not use this setting. The default value is resizable=no, so I have to explicitly say yes, I do want the window to be resizable. I am trying to make navigation easier for my users, not restrictive.

An object is returned after the window has been opened. This is the object I intend to use to pass the parameters to, be notified when the window has closed and retrieve the returned value. Here is my code so far:

Javascript

function openWindow(url)
{
var win = window.open (url, 'CHCR', config='height=300, \
width=520, toolbar=no, menubar=no, scrollbars=yes, resizable=yes, \
location=no, directories=no, status=no');

}

HTML
<div onclick=”openWindow(’../SuburbLookup.htm’);”>..</div>
This will open my window and meets requirement 1.

Stay tuned for further progress on my window.

  1. No comments yet.
  1. No trackbacks yet.