Here is what I've got right now...
I have a web page that when accessed, it connects to surveygizmo.com via their open API, retreives a whole lot of data, and then returns that data to me for processing on my end. This process takes roughly 10-12 seconds and while it is executing, the page just sits in the "loading" state and I'm shown a blank white page.
Here is what I want to happen...
When that same web page is accessed, I'd like it to kick off the script execution and begin retrieving the data from surveygizmo.com via their API in the same way I'm doing it now, but while that process is running, I would like there to be a "result are loading" page/message that is shown instead of the blank white page and then once the script execution finishes and all the results have been returned and processed, the "results are loading" page/message disappears.
I'm pretty familiar with php and javascript, but haven't been able to figure this one out yet. Any direction or advice on the matter would be greatly appreciated.
Thanks!
You'll want to take a look at AJAX. The solution is to send the browser a "loading" page, which contains javascript that shows the loading message, and then connects to the actual data generating server-side script asynchronously. When you have received and processed the data, you can insert it into the DOM and remove the loading message. Googling for XMLHttpRequest will get you the details.
Create a loading page that displays your desired loading message. Then using ajax (I HIGHLY recommend jQuery) load a separate php file that loads the outside data. Once the data returns to your loading page, it's a simple task of hiding the loading message and replacing it with the output of the ajax.
<?php
echo "Working...<br/>\r\n"; flush(); //output to the browser before the rest of the execution
connect_surveygizmo(); //this is going to take while.
echo "Finished!";
?>
Related
This is a complex question so I'll try and be precise.
I've experimented with AJAX but this form requires many changes to do it. I'd like to know if there are other options.
I have a form which takes a very long time to complete. Let's say the form exists on page A. The form submits and calls page B.
Page B looks like this, and gives the incorrect result (the page appears blank while loading):
<html>header</html>
<?php
longformresult()
?>
If I setup the page like this I get the result I am looking for (the page waits until the long function is done to load the page, allowing me to display a loading screen on page A).
<?php
longformresult()
?>
<html>header</html>
however this is where things get really tricky, the longformresult() can fail and break everything below it.
Is there some way I can tell php to wait until the page is fully loaded before sending the page, allowing me to have a loading screen on page A? Or prevent a die() from killing my page? I essentially need to delay the appearance of Page B, and actually just a sleep() is probably the best approach I've had so far:
<?php
sleep(4)
?>
<html>header</html>
<?php
longformresult()
?>
Edit: Conclusion (Not the fix I was looking for though)
I used ajax and removed 'Page B' entirely.
PHP waits by default to complete the function call before proceeding (see this previous answer), so PHP necessarily waits for the page to be fully loaded before returning.
AJAX would not require "many changes" if this is truly the behavior of the program. You would simply have a new file like C.php which returns the output of longformresult(), which you can later inject into your page.
I have a webpage that is auto-refreshed every 240 seconds with the generic HTML Meta tag. During the refresh it pulls data from a database which takes the site about 15 to 20 seconds to build before it's shown to the user. During this time I wish to show a small DIV with a loading message telling the user that it's loading data.
The more complicated thing about this is that the user has a few menu options to filter out specific data from the database. When clicking such an option the page is reloaded again and takes 15 to 20 seconds to build.
Users that aren't familiar with this loading time might feel the need to click the same menu option over and over again within a few seconds hoping that the page will load faster. But instead it will most likely cause the database server to get overloaded with requests.
So, to tackle this I wish to use jQuery to show a loading message, then have it load the data from the database (with a PHP script) and finally dump the data on the page.
I've done something similar but that was limited to users clicking a link which caused a jQuery script to load the data while showing the waiting DIV (using CSS rules).
I can't figure out how to implement this solution for an auto-refresh.
Some help would be nice.
You can use the same solution with auto-refresh as well, with the mention that the initial page load doesn't container the data that requires the DB call, but instead shows a loading message and starts an AJAX call to a server side script that returns the data.
Your page load:
Request
Server query DB
DB Response
Page loads (with data)
Ideal page load:
Request
Page loads (without data) <- loading message here
AJAX call
Server query DB
DB Response
Page updates (with data)
I'd second megawac's comment. Don't use a meta refresh. Also, 15-20 seconds is a very long time for generating a database report that is going to be generated every 4 minutes; odds are that you're bogging down your server pretty badly. Very few queries should really take that long, especially queries that need to be run nearly continually. I would strongly recommend refactoring your queries or doing some caching to speed things up. If you post some code, I'm sure people would be happy to look at it.
What would be the best approach to give the user feedback, that a PHP script is running while they wait?
I've got a PHP script that runs via an AJAX call when a user clicks a button.
The PHP script deals with large heavy images and takes some time before it is completed.
Because it is activated via an AJAX call, the user get's no visual feedback that the PHP script is running, because the user does not leave the page.
How do I go about giving some kind of visual feedback that something is happening via PHP in the background?
A simple .gif that is visible during the loading time of the script would suffice.
The easiest way to do it is to show the image as soon as the click takes place. You could do this by having an image already in place styled with display: none and then use jQuery's show() function to show it.
When you get your success message within your AJAX call, hide the image again.
If you have incremental activity that you want to show textually you can also direct the action at an iframe and have php echo and flush.
echo "Beginning Step 1... <br/>";
flush();
// do step 1
echo "Step 1 Complete!<br/>";
echo "Beginning Step 2...<br/>";
flush();
// etc..
I have a script the processes about 100 rows of data within a foreach loop. I would like to have a page that has a submit button and as the script successfully iterates it would append data from that row to a div on the page- giving some feedback to the user. It's different than most of the examples Im seeing online in that the php script would be posting multiple times instead just once. thanks for any input
Due to the nature of HTTP, your best bet might be to use Ajax.
My thoughts would be to send an Ajax request to your script, and then once the script is done and sends the response, parse the response and put it into your div.
Make 2 calls to php from jQuery
I have a run.php that has a button on it called "Run". Clicking it does a jQuery $.get() AJAX call back to a response.php on the server, and sends the result to a Javascript callback function getResponse(sData) inside run.php's HTML for display back on the browser. I want to have things such that as response.php runs through a list of tasks, it echoes a response back with the echo command and for getResponse to update a DIV with that status as it moves along. So, let's say I have 5 steps inside response.php, and therefore 5 echo statements back to getResponse().
I tried to get this to work, but what happens is that jQuery waits and then sends one single response all at once, rather than sending as it goes along with the 5 responses.
What's the technique?
The reason I ask is that I have a script that does something to a bunch of files. The first thing it does is a file count, so it updates my progress bar. Then, as it runs through files, it needs to increment my progress bar like every 1000 files.
I think there's no way to make that ajax call to have multiple response in just one call... but what I could suggest is you make a session on php... and in every steps on your tasks function, update that session... then make another ajax call that checks that session if any updates happened... if there is update then do what you have to do....
As you can't really get progress with xmlhttprequest, I suggest you can look into other ways of doing AJAX calls. One of them is through iframe. You can create hidden iframe, set it's sources to request.php and then periodically just check it's content. It should be possible since it's all it the same domain and restrictions does not apply.
iframe might work because it's not that different from normal browser window, meaning that it periodically applies data it gets into DOM even if request hasn't been finished yet. There's potentially might be problems with how different browsers do that, i.e. IE shows new content only if it got more than 4K or something. But it is possible to overcome that, I'm sure.
So, create new hidden iframe, add src attibute to your php script, make that script periodically write something to the client and on the client check what have been written and convert it to shiny GUI stuff.