Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations derfloh on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Dynamic Javascript in new window 1

Status
Not open for further replies.

guitardave78

Programmer
Joined
Sep 5, 2001
Messages
1,294
Location
GB
Ok so I open a new window using window.open

Then I add content

Code:
	newWin = window.open('about:blank','Uploading','width=200,height=100,status=no');
	newWin.document.write("<html><head><title>Uploading</title><style>body{font-family:verdana;font-size:90%;background-color:#F0F1F5;}</style>")
	newWin.document.write("<body><script src='includes\js.js'></script><script>alert('hello')</script><div id='uploading' style='display:block'><img src='images/loading.gif' alt='Loading' /> Uploading...<br>Please Wait.</div></body></html>")

In firefox i get the alert box that says hello.
In IE i dont
Any ideas?

}...the bane of my life!
 
try:

Code:
newWin = window.open('about:blank','Uploading','width=200,height=100,status=no');
[red]newWin.document.open();[/red]
newWin.document.write("<html><head><title>Uploading</title><style>body{font-family:verdana;font-size:90%;background-color:#F0F1F5;}</style>")
newWin.document.write("<body><script src='includes\js.js'></script><script>alert('hello')</script><div id='uploading' style='display:block'><img src='images/loading.gif' alt='Loading' /> Uploading...<br>Please Wait.</div></body></html>")
[red]newWin.document.close();[/red]



*cLFlaVA
----------------------------
[tt]somebody set up us the bomb![bomb][/tt]

[URL unfurl="true"]http://www.coryarthus.com/[/url]
 
guitardave, from your last 2 posts it sounds like when you have your next page loading that you'd like a message to pop up so the users have something to look at while the next page loads. You can use an absolutely positioned div to do the same thing and then you won't have the problem of trying to make it go away when the new page loads. By default, the next page will not being to write to the screen until it has finished loading server side and the data is flushed to the browser (unless you are manually flushing the buffer or have buffering disabled - it's enabled by default). For that reason, your popup will stay on the screen till the new page begins writing to the screen.

Here's a small example:
(I put return false on the function so that the page didn't submit and you could see the popup)
Code:
<script type="text/javascript">
function blah(frm) {
   document.getElementById("waitingDiv").style.display = "block";
   return false;
}
</script>

<style type="text/css">
div#waitingDiv {
   position:absolute;
   border:1px solid black;
   padding:10px;
   width:100px;
   height:100px;
   text-align:center;
   display:none;
   top:50%;
   left:50%;
   margin-top:-60px;
   margin-left:-60px;
}
</style>

<div id="waitingDiv">Please wait while the new page loads</div>
<form onsubmit="return blah(this)">
<input type="submit" value="click me" />
</form>

-kaht

Looking for a puppy?

silky-icon-left.gif
[small]Silky Terriers are small, relatively odorless dogs that shed no fur and make great indoor pets.[/small]
silky-icon-right.gif
 
to answer your question from above, you'll likely have to break up your script tags when they are written to the new window. It can cause problems otherwise: (although I still opt for the floating div if that's an acceptable solution for you)
Code:
newWin = window.open('about:blank','Uploading','width=200,height=100,status=no');
newWin.document.open();
newWin.document.write("<html><head><title>Uploading</title><style>body{font-family:verdana;font-size:90%;background-color:#F0F1F5;}</style>")
newWin.document.write("<body><scr[!]" + "[/!]ipt src='includes\js.js'></scr[!]" + "[/!]ipt><scr[!]" + "[/!]ipt>alert('hello')</scr[!]" + "[/!]ipt><div id='uploading' style='display:block'><img src='images/loading.gif' alt='Loading' /> Uploading...<br>Please Wait.</div></body></html>")
newWin.document.close();

-kaht

Looking for a puppy?

silky-icon-left.gif
[small]Silky Terriers are small, relatively odorless dogs that shed no fur and make great indoor pets.[/small]
silky-icon-right.gif
 
Unfortunatly the buffer is flushed and all sorts. Then there is a redirect. It has to be done with client side scripts.

}...the bane of my life!
 
I see, did breaking up the word script work?

-kaht

Looking for a puppy?

silky-icon-left.gif
[small]Silky Terriers are small, relatively odorless dogs that shed no fur and make great indoor pets.[/small]
silky-icon-right.gif
 
here is the function, It works in FF but needs a refresh in ie for the javascript to work
Code:
	newWin = window.open('','Uploading','width=200,height=100,resizable=yes,status=no');
	var str = ""
	str+="<html><head><title>Uploading</title><style>body{font-family:verdana;font-size:90%;background-color:#F0F1F5;}</style></head>"
	str+="<scr"+"ipt>function closeUpload(){alert(\"helloe\")}<\/scr"+"ipt><body>"
	str+="<scr"+"ipt>onload = closeUpload()</scr"+"ipt>"
	str+="<div id='uploading' style='display:block'><img src='images\/loading.gif' alt='Loading' \/> Uploading...<br \/>Please Wait.<\/div>"
	str+="<\/body><\/html>"
	newWin.document.write(str)

}...the bane of my life!
 
try changing this line:
Code:
str+="<scr"+"ipt>onload = closeUpload()</scr"+"ipt>"
to this:
Code:
str+="<scr"+"ipt>[!]window.[/!]onload = closeUpload; [!]/* note: got rid of () */[/!]</scr"+"ipt>"

-kaht

Looking for a puppy?

silky-icon-left.gif
[small]Silky Terriers are small, relatively odorless dogs that shed no fur and make great indoor pets.[/small]
silky-icon-right.gif
 
Ok, this is what I see as the problem. You are opening a new window. This window is opened with a blank template - it finishes loading it's blank template. After it has finished loading, you are using document.write to "rewrite" the page. Using document.write after a page has completed loading will erase the contents of what was originally loaded on the page. However, you don't observe this behavior because the popup was originally loaded as blank.

So, when you write the new content to the page you are assigning an onload handler to the page. However, this never gets fired because the popup has completed loading long before it ever sees this event handler. When you refresh the page, it is refreshing it's current contents as a new load of the page. For this reason the onload handler is fired and the function is ran.

The solution:
Instead of using a handler to call the function, make an explicit call to the function yourself with a pair of script tags at the bottom of the page - this will usually ensure that all divs and other content will be loaded by the time the script kicks off. Here's my example, it worked fine in IE:
Code:
<script type="text/javascript">

function blah() {
    newWin = window.open('','Uploading','width=200,height=100,resizable=yes,status=no');
    var str = ""
    str+="<html><head><title>Uploading</title><style type=\"text/css\">body{font-family:verdana;font-size:90%;background-color:#F0F1F5;}</style>"
    str+="<scr"+"ipt type=\"text/javascript\">function closeUpload(){alert(\"helloe\")}<\/scr"+"ipt>"
    str+="<body><div id='uploading' style='display:block'><img src='images\/loading.gif' alt='Loading' \/> Uploading...<br \/>Please Wait.<\/div>"
    [!]str+="<scr"+"ipt type=\"text/javascript\">closeUpload();</scr"+"ipt></head>"[/!]
    str+="<\/body><\/html>"
    newWin.document.write(str);
}

</script>

<input type="button" value="click me" onclick="blah()" />

-kaht

Looking for a puppy?

silky-icon-left.gif
[small]Silky Terriers are small, relatively odorless dogs that shed no fur and make great indoor pets.[/small]
silky-icon-right.gif
 
The above example I posted worked fine in IE, so there must be something else you're not showing us.

Copy/paste it and try for yourself.

-kaht

Looking for a puppy?

silky-icon-left.gif
[small]Silky Terriers are small, relatively odorless dogs that shed no fur and make great indoor pets.[/small]
silky-icon-right.gif
 
Hell, dont know why but that code worked!!
I have found my way round it now, once the upload is finished it writes a cookie, on the parent page refres it looks for that cookie to tell the upload window to close.

Thanks for your help and have a star!!

}...the bane of my life!
 
Thanks, glad you found a solution.

-kaht

Looking for a puppy?

silky-icon-left.gif
[small]Silky Terriers are small, relatively odorless dogs that shed no fur and make great indoor pets.[/small]
silky-icon-right.gif
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top