/    Sign up×
Community /Pin to ProfileBookmark

How to display image while query is processing

Copy linkTweet thisAlerts:
Dec 30.2005

Some of my querys are taking a while to run in a larger database.

Is there a way to make an image (an animated .gif) display while the query processes on the server so the user will have a visual cue that there is activity in the background?

to post a comment
PHP

4 Comments(s) ↴

Copy linkTweet thisAlerts:
@scojo1Dec 30.2005 — You could do this with everyone's favorite word of the day AJAX

something like this:

[CODE]
<script type="text/javascript">
function createRequest(){ //creates the object for mozilla/ie respectively
var requester;
try{
var requester = new XMLHttpRequest();
}
catch (error){
try{
var requester = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (error){
return false;
}
}
return requester;
}

function sendRequest(){
test_request = createRequest();
test_request.onreadystatechange = handleResponse;
test_request.open('GET', 'process.php?var1=dsfad'); //process stuff on the backend
test_request.send(null);
}

function handleResponse(){//when you get a response back do whatever you want with them
if(test_request.readyState == 4){
var response = test_request.responseText;
if(response != ""){
document.getElementById('results').innerHTML = response;
}
else{
document.getElementById('results').innerHTML = "<h3>ERROR</h3>";
}
}
}
</script>[/CODE]


there may be a better/more concise way to do this. However, you can have an image in your page, and then call sendRequest() on page load. The image will display while the processing script is being run


**In the processing script, just ouput (echo, or whatever) the final results you want to display
Copy linkTweet thisAlerts:
@UbikDec 30.2005 — This is what I use:

[code=html]
<!-- if using Classic ASP: -->
<%
Response.Buffer = true
%>

<!-- if using PHP: -->
<?
ob_start();
?>

<!-- this bit goes at the very top of the page: -->
<div id='interstitial'>
<img src="LoadingAnimation.gif" width="50" height="50" alt="Loading ... Please wait... " />
</div>

<!-- This is for those times where you have to [asp: response.end] [php: exit(); ] for some reason-->
<script language="javascript">
setTimeout('interstitial.style.display="none";',10000);
</script>

<!-- if using Classic ASP: -->
<%
response.flush
%>

<!-- if using PHP: -->
<?
ob_end_flush();
?>

<!--
Insert your entire page contents here, including calls to the database
-->

<!-- this bit goes at the very bottom of the page: -->
<script language="javascript">
interstitial.style.display="none";
</script>
[/code]

Not much to look at, but it gets the job done.
Copy linkTweet thisAlerts:
@adamjkinneyJun 22.2011 — Ubik My issue with this is that it runs after my query is done. I need it to run While my query is working, am i just doing something wrong?
Copy linkTweet thisAlerts:
@NogDogJun 22.2011 — The short answer is that no, you cannot do that [i]with a purely PHP solution[/i]. This is because the PHP is processed on the host and then sent to the browser. Within the PHP you cannot say "display this", do some processing, and then say "stop displaying that". You'll need to use some sort of client-side processing, and in that respect AJAX is probably your best bet. This means the main script would display the page with the "processing" graphic, but not do the DB stuff. The page would include JavaScript which would make an AJAX call to a [i]separate[/i] PHP script that would do the DB work and return its result, which the JavaScript would then insert into the document (while removing/hiding the "processing" graphic. As a fairly simple example, see: http://charles-reace.com/test/ajax/.
×

Success!

Help @scaiferw spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...