dblacker
asked on
simple javascript upload progress bar
I know little to no javascript and basically rely on dreamweavers behaviors options to add finctions to my pages.
I have an annimated gif that I would like to use as a progress bar. I would like a new window to pop up displaying the annimated gif when the form is submitted. And then have the window automatically close when php page that handles the form redirects to another page after the upload is complete.
Again my experience with javascript is shaky at best so the more basic the solution the better it is for me.
I have an annimated gif that I would like to use as a progress bar. I would like a new window to pop up displaying the annimated gif when the form is submitted. And then have the window automatically close when php page that handles the form redirects to another page after the upload is complete.
Again my experience with javascript is shaky at best so the more basic the solution the better it is for me.
sorry
change pop.write("<img src='image.gif'>");
to
pop.document.write("<img src='image.gif'>");
But to close the popup window when the download is completed, u have to put the status of "upload" in a session variable...
ie; Put the session value to "ok" ,say when download completes..and u have to periodically check (from pop up)
whether the session is set or not..
This can be done using XMLHTTP.
If it is set then close the popup using
window.close();
Riyasjef
change pop.write("<img src='image.gif'>");
to
pop.document.write("<img src='image.gif'>");
But to close the popup window when the download is completed, u have to put the status of "upload" in a session variable...
ie; Put the session value to "ok" ,say when download completes..and u have to periodically check (from pop up)
whether the session is set or not..
This can be done using XMLHTTP.
If it is set then close the popup using
window.close();
Riyasjef
ASKER
This works for getting the window to pop up - but i need the window to close after the form has
been processed and the files are uploaded...
been processed and the files are uploaded...
ASKER
could you give an example of putting it into a session variable?
modification of riyasjef's code:
<script language="JavaScript">
var pop;
function popup()
{
pop = window.open("test.htm", "hello", 'toolbar=no,location=no,di rectories= no,status= no,menubar =no,scroll bars=no,re sizable=no ,width=150 ,height=10 0');
pop.focus();
pop.document.write("<img src='image.gif'>");
}
function closeit()
{
pop.close();
}
</script>
<body onUnload="closeit();">
<form onsubmit="return popup()">
...............
</form>
The body tag should take care of it. When the page is redirected, the popup window will close.
<script language="JavaScript">
var pop;
function popup()
{
pop = window.open("test.htm", "hello", 'toolbar=no,location=no,di
pop.focus();
pop.document.write("<img src='image.gif'>");
}
function closeit()
{
pop.close();
}
</script>
<body onUnload="closeit();">
<form onsubmit="return popup()">
...............
</form>
The body tag should take care of it. When the page is redirected, the popup window will close.
@McFrosty
as soon as the form is submitted the ..popup closes..But it should not
Here is my scripts
Hi these are the steps to follow
U have to put a hidden field in the page to which redirection is done and set its value as 1(ie; the last page loads in the parent)
and from the popup it will check whether this field is set or not
if set , then close it..
These are the changes
Main.html
-----------
<script language="JavaScript">
function popup()
{
var pop = window.open("progressbar.h tml", "hello", 'toolbar=no,location=no,di rectories= no,status= no,menubar =no,scroll bars=no,re sizable=no ,width=150 ,height=10 0');
pop.focus();
}
</script>
<form onsubmit="return popup()">
...............
</form>
--------------------------
progressbar.html
-------------
<html>
<head>
<script>
function setTimer()
{
T=setInterval("check()",10 0);
}
function check()
{
if(window.opener)
{
if(window.opener.getElemen tById("hdn Status"))
{
if(window.opener.getElemen tById("hdn Status")== 1)
{
clearInterval(T);
window.close();
return false;
}
}
}
}
</script>
</head>
<body onload="setTimer()">
<img src="progress.gif">
</body>
</html>
-------------------------- ---------- ----------
Message.html // Page To which redirection is done
-------------------------- ---------- ---------- ---
<html>
<body>
<input type="hidden" name="hdnStatus" value=1>
</body>
</html>
Riyasjef
as soon as the form is submitted the ..popup closes..But it should not
Here is my scripts
Hi these are the steps to follow
U have to put a hidden field in the page to which redirection is done and set its value as 1(ie; the last page loads in the parent)
and from the popup it will check whether this field is set or not
if set , then close it..
These are the changes
Main.html
-----------
<script language="JavaScript">
function popup()
{
var pop = window.open("progressbar.h
pop.focus();
}
</script>
<form onsubmit="return popup()">
...............
</form>
--------------------------
progressbar.html
-------------
<html>
<head>
<script>
function setTimer()
{
T=setInterval("check()",10
}
function check()
{
if(window.opener)
{
if(window.opener.getElemen
{
if(window.opener.getElemen
{
clearInterval(T);
window.close();
return false;
}
}
}
}
</script>
</head>
<body onload="setTimer()">
<img src="progress.gif">
</body>
</html>
--------------------------
Message.html // Page To which redirection is done
--------------------------
<html>
<body>
<input type="hidden" name="hdnStatus" value=1>
</body>
</html>
Riyasjef
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
That would do it...gj Ri
<script language="JavaScript">
function popup()
{
var pop = window.open("test.htm", "hello", 'toolbar=no,location=no,di
pop.focus();
pop.write("<img src='image.gif'>");
}
</script>
<form onsubmit="return popup()">
...............
</form>
riyasjef