closing of Window Widget created page

**serone** · 10-04-2009, 05:38 PM

1) Script Title: Window 1 (iframe content)

2) Script URL (on DD): http://dynamicdrive.com/dynamicindex8/dhtmlwindow/index.htm

3) Describe problem:

I am a newbe to both Window Widget and javascript and am a little lost. I would like to use the 'Google' window script sample:

<code>


<script type="text/javascript">

}
</script>
</code>

Which works ok. It opens the memlog.html window over the current page. My problem is in closing the created window using buttons on the memlog page. Here is the memlog.html code:

<code>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<?xml-stylesheet type="text/css" href="stylesheet.css"?>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>Wire Login</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="description" content="Test website." />
<meta name="keywords" content="German" />
<link rel="stylesheet" href="windowfiles/dhtmlwindow.css" type="text/css" />
<script type="text/javascript" src="windowfiles/dhtmlwindow.js">
/***********************************************
* DHTML Window Widget- © Dynamic Drive (www.dynamicdrive.com)
* This notice must stay intact for legal use.
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
</script>
</head>

<body bgcolor="#cococo" oncontextmenu="return false">


<div align="center" style="color: red; font-weight: bold; font-size: 20pt">Member Login</div>
<br /><br />
<p align="center">
Username <input type="text" name="uname" size="20" />
<img src="images/transparent.gif" alt="space" />
Password <input type="password" name="pw" size="20" />
</p>

<p align="center">
<input type="button" name="login" value="Login" onclick="dhtmlwindow.close(this._parent)" />
<img src="images/transparent.gif" alt="space" />
<input type="button" name="cancel" value="Cancel" onclick="t.close()" />
<img src="images/transparent.gif" alt="space" />
<input type="button" name="close" value="Close" onclick="windowinstance.close()" />
<img src="images/transparent.gif" alt="space" />
<input type="button" name="close" value="Close" onclick="googlewin.close()" />
<img src="images/transparent.gif" alt="space" />
<a href="#" onclick="googlewin.close; return false">Close Window</a>
<input type="button" name="close" value="Close" onclick="windowinstance.close()" />
</p>


</body>
</html>
</code>
No matter which way I try, none of the buttons work to close the page. What am I doing (or not doing) that's wrong??

SER

**ddadmin** · 10-04-2009, 07:44 PM

This question has actually been answered a few times on the forums already. Anyhow, when accessing the DHTML window functions from the IFRAME page itself, you need to prefix the default code with ".parent", so for example:

Code:

<input type="button" name="close" value="Close" onclick="parent.windowinstance.close()" />

BTW, your memlog.html page doesn't need to include the DHTML window script, only the parent page that launches memlog.html. That is unless on memlog.html, you're further launching another DHTML window.

**serone** · 10-07-2009, 02:00 PM

Originally Posted by ddadmin

This question has actually been answered a few times on the forums already. Anyhow, when accessing the DHTML window functions from the IFRAME page itself, you need to prefix the default code with ".parent", so for example:

Code:

<input type="button" name="close" value="Close" onclick="parent.windowinstance.close()" />

BTW, your memlog.html page doesn't need to include the DHTML window script, only the parent page that launches memlog.html. That is unless on memlog.html, you're further launching another DHTML window.

Thanks for the response. I replaces your code into memlog but when I click it nothing happens except the button shows it has been clicked. The URL is http://www.gwpsocal.com/index2.html.

Stephen

**ddadmin** · 10-07-2009, 09:44 PM

The code isn't working due to a JavaScript security issue, namely, a mismatch of the domains of the calling page and the page contained in the DHTML Window. Try adding "www" to the URL you're displaying in the window, so the two match:

Code:

var googlewin=dhtmlwindow.open("googlebox", "iframe", "http://www.gwpsocal.com/memlog.html", " ", "width=510px,height=420px,resize=1,scrolling=1,center=1", "recal")
googlewin.onclose=function(){ //Run when window is being closed (return false to cancel action):
return window.confirm("Close window?")

**serone** · 10-07-2009, 10:33 PM

Originally Posted by ddadmin

The code isn't working due to a JavaScript security issue, namely, a mismatch of the domains of the calling page and the page contained in the DHTML Window. Try adding "www" to the URL you're displaying in the window, so the two match:

Code:

var googlewin=dhtmlwindow.open("googlebox", "iframe", "http://www.gwpsocal.com/memlog.html", " ", "width=510px,height=420px,resize=1,scrolling=1,center=1", "recal")
googlewin.onclose=function(){ //Run when window is being closed (return false to cancel action):
return window.confirm("Close window?")

Ok, made the change and put the www on the call to memlog page. Still no change in button responce. Using FF, I checked the error log which gave several errors for the css file and a red error "parent.windowinstance is undefined in www.gwpsocal.com/memlog.html"

This is current code for that page:

<code>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<?xml-stylesheet type="text/css" href="stylesheet.css"?>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>WPCL</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="description" content="Test website." />
<meta name="keywords" content="GWP" />
<link rel="stylesheet" href="windowfiles/dhtmlwindow.css" type="text/css" />
</head>

<body bgcolor="#cococo" oncontextmenu="return false">


<div align="center" style="color: red; font-weight: bold; font-size: 20pt">Member Login</div>
<br /><br />
<p align="center">
Username <input type="text" name="uname" size="20" />
<img src="images/transparent.gif" alt="space" />
Password <input type="password" name="pw" size="20" />
</p>

<p align="center">
<input type="button" name="close" value="Close" onclick="parent.windowinstance.close()" />

<img src="images/transparent.gif" alt="space" />

</p>


</body>
</html>
</code>

Now I do have the 'form' tag commented out, would that be the problem??

SR

**ddadmin** · 10-08-2009, 03:29 AM

You need to replace "windowinstance" in "parent.windowinstance" with the variable assigned to dhtmlwindow.open(), in your case, "googlewin":

Code:

var googlewin=dhtmlwindow.open("googlebox", "iframe", "http://www.gwpsocal.com/memlog.html", " ", "width=510px,height=220px,resize=1,scrolling=1,center=1", "recal")
googlewin.onclose=function(){ //Run when window is being closed (return false to cancel action):
return window.confirm("Close window?")

**serone** · 10-08-2009, 05:20 AM

That did the trick. Is there a 'user guide' for this stuff??

Many thanks!

Ps: How do I mark this solved?

Thread: closing of Window Widget created page

Thread Tools

Search Thread

closing of Window Widget created page

Bookmarks

Bookmarks

Posting Permissions