Welcome to WebmasterWorld Guest from 50.17.5.36

Forum Moderators: open

Message Too Old, No Replies

Problem with JavaScript popup windows

     
1:25 am on Jul 18, 2002 (gmt 0)

New User

5+ Year Member

joined:July 10, 2006
posts:2
votes: 0


Hello-

I am having trouble with the following piece of JavaScript code, which is supposed to open a new window when the submit button is clicked and then close the window after the cgi script has completed processing:

<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
var win;
function OpenWindow() {
win = window.open("http://www.asite.com","upload","toolbar=no,location=no,directories=no,menubar=no,scrollbars=no,width=290,height=170,left=665,top=440")
document.forms[0].submit();
return false;
}

function KillWindow() {
win.close();
}
//-->
</SCRIPT>
</HEAD>
<BODY ONUNLOAD="KillWindow()">

<FORM ACTION="http://www.asite.com/cgi-local/script.cgi" METHOD="post">
<TABLE BORDER="0" CELLPADDING="1" CELLSPACING="1">
<TR><TD>Filename</TD></TR>
<TR><TD><INPUT TYPE="file" SIZE="22" NAME="filename"></TD></TR>
<TR><TD ALIGN="center"><INPUT TYPE="button" VALUE="Submit" ONCLICK="return OpenWindow()"></TD></TR>
</TABLE>
</FORM>

</BODY>
</HTML>

When I run this code in IE, I get the following script error:

Line: 14
Char: 3
Error: 'win' is null or not an object
Code: 0

I would appreciate very much any help I can get with this problem.

jerryxh

1:29 am on July 18, 2002 (gmt 0)

Administrator

WebmasterWorld Administrator jatar_k is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:July 24, 2001
posts:15755
votes: 0


Welcome to WmW jerryxh,

I think you have to do upload.close();

win is the variable and not the window name.

1:46 am on July 18, 2002 (gmt 0)

New User

5+ Year Member

joined:July 10, 2006
posts:2
votes: 0


Thank you for your response jatar_k.

With your change, however, I now get the following error message:

Line: 14
Char: 3
Error: 'upload' is undefined
Code: 0

Any more ideas?

Jerryxh

1:52 am on July 18, 2002 (gmt 0)

Administrator

WebmasterWorld Administrator jatar_k is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:July 24, 2001
posts:15755
votes: 0


what if you have an onBlur self.close(); in the popup and a onLoad=self.focus(); on the page it goes to when the script finishes?
6:31 am on July 18, 2002 (gmt 0)

Senior Member

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Mar 15, 2002
posts:6807
votes: 0


Do this instead:

Let the page with the form open the window the way it does now. But, let the page returned after processing the script close the window.

Your problem is that the object is not yet created when the script attempts to close it. :)

9:25 am on July 18, 2002 (gmt 0)

Preferred Member

10+ Year Member

joined:June 7, 2002
posts:475
votes: 0


I think you have to do upload.close();

win is the variable and not the window name.

This advice is wrong (as you have discovered).

win is a reference to the window object that was created, and contains all its properties and methods (such as document and close()). "upload" is the value of win.name -- it's a String object. It is also the value that would be used by any HTML target attribtes:

<a href="xyz.html" target="upload">

3:35 pm on July 18, 2002 (gmt 0)

Administrator

WebmasterWorld Administrator jatar_k is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:July 24, 2001
posts:15755
votes: 0


rewboss,

so you can clear me up then, is the win reference still available from any other page?

Is upload still not the name of the created window object and still available? or does assigning the window.open to a var mean that you can no longer use the name you opened it with for targeting?

6:57 am on July 19, 2002 (gmt 0)

Senior Member

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Mar 15, 2002
posts:6807
votes: 0


This example should clearify your questions:

<html>
<head>
<title></title>
<script language="JavaScript" type="text/javascript">
function openWin() {
win = window.open("about:blank","upload","width=200,height=200");
}
</script>
</head>
<body>
<a href="javascript:openWin()">Open 'upload'</a> ¦
<a href="javascript:upload.focus();">Focus 'upload'</a> ¦
<a href="javascript:upload.document.write('written');">Write 'upload'</a> ¦
<a href="javascript:upload.close();">Close 'upload'</a> ¦
<a href="javascript:win.focus();">Focus 'win'</a> ¦
<a href="javascript:win.document.write('written');">Write 'win'</a> ¦
<a href="javascript:win.close();">Close 'win'</a> ¦
<a href="javascript:document.write('targetted')" target="upload">Target 'upload'</a>
</body>
</html>

1:51 pm on July 19, 2002 (gmt 0)

New User

5+ Year Member

joined:July 10, 2006
posts:2
votes: 0


Thanks for everyones help. I did come up with a solution and it involves replacing the KillWindow() function with:

function KillWindow() {
if (typeof win != "object") {
win = window.open("", "upload");
win.close();
}
else {
if (!win.closed) {
win.close();
}
}
}

The only minor problem with this solution is that in Internet Explorer (but not in Netscape) the line

win = window.open("", "upload");

causes a small window to open up for a fraction of a second each time a link or button on the page is clicked. Does anyone know if there is a way to to work around this minor problem?

jerryxh

3:53 pm on July 19, 2002 (gmt 0)

Administrator

WebmasterWorld Administrator jatar_k is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:July 24, 2001
posts:15755
votes: 0


thx DrDoc,

I never knew that very interesting. It would seem that when assigning a window open to a var that the only way to interact with it is through that reference and not through it's name. hmm

11:49 am on July 21, 2002 (gmt 0)

Preferred Member

10+ Year Member

joined:June 7, 2002
posts:475
votes: 0


You have to be quite clear about the difference between a name and a reference to an object.

When you use JavaScript to create a window using window.open(), the function returns a window object. If you want to manipulate the window using JavaScript, you will need to store the object in a variable. The name of the window is one of the properties of the Window object.

When you type:

var myWindow=window.open('about:blank','popup','width=300,height=400');

that returns a Window object which is referenced by the variable myWindow. That object contains all the properties and methods you need to manipulate that window. For example:

myWindow.document.location='newpage.html';
myWindow.resizeTo(200,200);
myWindow.document.write('<h1>Hello world</h1>');
myWindow.close();
if(!myWindow.closed) valueForHTMLtargetAttribute=myWindow.name;

One of the many properties available in the Window object referenced by the variable myWindow is myWindow.name.

This is a String, not a Window. So you can use String methods and access String properties, but you can't use Window methods or properties on it. This is OK:

myWindow.name.toUpperCase();
var lengthOfName=myWindow.name.length;

This is not:

myWindow.name.close();

If you try this:

window.open('','popup','');

it will open a window, and you will be able to target <a> tags using <a target="popup" ...>, but you won't be able to manipulate it with JavaScript because you cannot reference the Window object -- you have no access through JavaScript of the name of the new window, which is a string stored in the name property of the new Window object. But you have not stored a reference to the object anywhere: it exists, but you can't use it.

popup will not have been initialized as a variable; if you try

popup.document.write('<h1>Hello World</h1>');

you will get an error message to the effect that "popup.document has no properties". What this means is that the top-level variable popup does not contain an object called document -- not surprising, because it has only just been initialized and nothing has been assigned to it.

When working with client-side JavaScript, you need to fully understand what objects are and how windows and frames are referenced from each other. It can get very confusing -- as here -- which is why it is important also to learn the terminology.

1:58 pm on July 21, 2002 (gmt 0)

Senior Member

WebmasterWorld Senior Member tedster is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:May 26, 2000
posts:37301
votes: 0


Thanks rewboss. That's about the clearest explanation I've read for a tricky situation --and one I know I've stumbled over before.

I hope it stays clear in my mind for the next time I'm up against it. But I'm going to flag this thread, just in case my brain goes on vacation!

8:43 pm on July 23, 2002 (gmt 0)

Administrator

WebmasterWorld Administrator jatar_k is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:July 24, 2001
posts:15755
votes: 0


thank you rewboss for taking the time to explain that so well, greatly appreciated.