By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,491 Members | 1,209 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,491 IT Pros & Developers. It's quick & easy.

Get trouble to show progress status

P: 23
Hello all..

merry christmas.. :)

I need to show progress status when a button is clicked.
I use this script. but I know that this code is still very bad.

Expand|Select|Wrap|Line Numbers
  1. <html>
  2.  
  3. <head>
  4.   <title>Loading test</title>
  5.  
  6.   <script language="javascript">
  7.     function Process() {
  8.       document.write("Please wait...");
  9.       location.href="index.php?page=main&action=process";
  10.     }
  11.   </script>
  12.  
  13. </head>
  14.  
  15. <body>
  16. <form>
  17. <input type="button" value="Process" onclick="Process();">
  18. </form>
  19.  
  20. </body>
  21.  
  22. </html>
  23.  
When I click BACK button, then it show 'Please wait..' without any direct. very ugly. :(

How to put the correct way to show a progress status?

Thank you very much.

best regards.
Dec 26 '07 #1
Share this Question
Share on Google+
4 Replies


P: 13
Using document.write is not possible after the page has loaded since it will wipe the entire page and any scripts in it.

to fix your code instead update the innerHTML of a div on the page
Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3.   <title>Loading test</title>
  4.   <script language="javascript">
  5.     function Process() {
  6.       document.getElementById('msg').innerHTML="Please wait...";
  7.       location.href="index.php?page=main&action=process";
  8.     }
  9.   </script>
  10. </head>
  11. <body>
  12. <form>
  13. <input type="button" value="Process" onclick="Process();">
  14. </form>
  15. <div id="msg"></div>
  16. </body>
  17. </html>
  18.  
However that will not necessarily work since changing the location unloads the page too...

Perhaps you can explain what you REALLY are doing - if you have a long server process you might want to use an iframe for the process and have some animated gif above the iframe...
Dec 26 '07 #2

P: 23
Hi.. thank you very much for the fast reply.

I have a form. When submit button is pressed, I need to show progress status while form data is processed.

Yes true, I need a gif animation. How to use iframe?

Could you give me the example?

I think it's very simple perhaps. Just show progress status/animation while form data is being processed. :)

Thank you very much in advance.
Dec 26 '07 #3

P: 13
You have two ways
1. if you need TRUE progress status you need a lot more complex setup depending on server since you need a separate thread on the server to monitor the first
2. just show a gif and remove it when the server returns with the result - here I use a "hidden" iframe and add something to the gif to make it not cache:

Expand|Select|Wrap|Line Numbers
  1. <form target="iframe1" action="..." method="get" 
  2. onSubmit="document.animation.src='pleasewait.gif?'+new Date().getTime()">
  3. .
  4. .
  5. </form>
  6. <img name="animation" src='blank.gif">
  7. <iframe width="1" height="1" name="iframe1" src="about:blank"></iframe>
  8.  
then in the server process which has to come from the same server as the page with the form you return
Expand|Select|Wrap|Line Numbers
  1. <script>
  2. parent.document.animation.src='blank.gif';
  3. </script>
  4.  
Dec 26 '07 #4

P: 23
thank you very much for the helps.

you helping me so much.

thank you. :)
Dec 26 '07 #5

Post your reply

Sign in to post your reply or Sign up for a free account.