[JS/AJAX?] Please Wait, Loading...

[Tree]

I have a rather large function that executes at a point on my site. It calculates the number of projected users using a complex and rather lengthy algorithm. This can take up to 30 seconds to execute.

How can I display "Please Wait, Future User Projection is Being Calculated." until all the calculations are finished?

The message should only be displayed in a table on the page.

 

[Jim_]

<?php 
echo "<div id=\"hidelater\">Please Wait, Future User Projection is Being Calculated.</div>";
ob_flush(); flush();

//your algorythm here

echo "<script>document.getElementById(\"hidelater\").style.display = 'none';</script>";
?>

That should work.

 

[Tree]

Alright, let me try it real quick. Thanks, Jim_!

It does! Thank you!

Sadly:

We're glad that you're fond of this member, but please give some rep points to some other members before giving it to Jim_ again.

 

[Jim_]

That error message made me smile.

 

[Tree]

Any way I can make this so that if it executes for more than 10 seconds have it display another message saying

This can take quite a long time if the selected date range is large. Please be patient.

The code for the large algorthm thing is

BIG($_POST['Fday'],$_POST['Fmonth'],$_POST['Fyear'],$_POST['Tday'],$_POST['Tmonth'],$_POST['Tyear'],$_POST['location'],$_POST['ageF'],$_POST['ageT'],$_POST['gender']);

 

[Jim_]

echo "<div id=\"hidelater\">Please Wait, Future User Projection is Being Calculated.</div>";

replace that^ with this:

echo "<div id=\"hidelater\">Please Wait, Future User Projection is Being Calculated.</div>
<script>
function tensecs() { document.getElementById(\"hidelater\").innerHTML = 'This can take quite a long time if the selected date range is large. Please be patient.'; }
window.setTimeout('tensecs()',10000);</script>";

 

[Tree]

Jim_,

I love you.

Whoop, nevermind. Now the message doesn't go away once the function is done. Here's my current code:

// Special thanks to Jim_ from NamePros.com
echo "<div id=\"hidelater\"><b><img src='pages/style/loadingcircle.gif'>  Please Wait, Future User Projection is Being Calculated.</b></div>
<script>
function tensecs() { document.getElementById(\"hidelater\").innerHTML = '<b><img src='pages/style/loadingcircle.gif'>  This can take quite a long time if the selected date range is large. Please be patient.</b>'; }
window.setTimeout('tensecs()',10000);</script>"; 
ob_flush(); flush();

BIG($_POST['Fday'],$_POST['Fmonth'],$_POST['Fyear'],$_POST['Tday'],$_POST['Tmonth'],$_POST['Tyear'],$_POST['location'],$_POST['ageF'],$_POST['ageT'],$_POST['gender']);

echo "<script>document.getElementById(\"hidelater\").style.display = 'none';</script>";

 

[Jim_]

try this:

 // Special thanks to Jim_ from NamePros.com
echo "<div id=\"hidelater\"><b><img src='pages/style/loadingcircle.gif'>  Please Wait, Future User Projection is Being Calculated.</b></div>
<script>
function tensecs() { document.getElementById(\"hidelater\").innerHTML = '<b><img src=\"pages/style/loadingcircle.gif\">  This can take quite a long time if the selected date range is large. Please be patient.</b>'; }
window.setTimeout('tensecs()',10000);</script>"; 
ob_flush(); flush();

BIG($_POST['Fday'],$_POST['Fmonth'],$_POST['Fyear'],$_POST['Tday'],$_POST['Tmonth'],$_POST['Tyear'],$_POST['location'],$_POST['ageF'],$_POST['ageT'],$_POST['gender']);

echo "<script>document.getElementById(\"hidelater\").style.display = 'none';</script>";

 

[Tree]

Nope

 

[Dan]

The only way I could think of doing it would be AJAX and using readystate..

 

[Tree]

How would that be coded? Sorry, my AJAX is not so good.