tags:

views:

54

answers:

1

I need a simple way to show that results are loading.. from database, while the page loads. I am not using jQuery to do this.

What I tried now is: I put a <div> tag with loading text in it and using JavaScript I made the display to none after the whole while loop. But I don't get to see the text at all.

<div id="loading">Loading Results...</div>

I put the above code just after the body tag.

I put the below code right after the while loop ending.

echo "<script>document.getElementById(\"loading\").style.display = \"none\"</script>";
+1  A: 

Call flush() after the <div>. If you are using output buffering it won't work. See the manual for the function.


If you don't want the element to be viewable in source the output is using JS. Instead of directly writing the <div> in the html write this:

<script type="text/javascript">
    document.write('<div id="loading">Loading Results...</div>');
</script>

<?php flush() ?>

<!-- output some html -->

<script type="text/javascript">
    var loader = document.getElementById('loading');
    loader.parentNode.removeChild( loader );
    // This will not just hide the element, but remove it from the DOM, .
</script>
Emil Ivanov
thanks. that worked. But is there any way to delete that element, so that I do not get to see it when the source is viewed?
JPro
I guess you could hack the behaviour by outputting a style tag to set the loading text visibility to hidden... It *is* hacky, though. :)
ZombieSheep
No, there is no way to remove the element from the viewable source. It can be removed from the DOM tree, but most browsers with a "View Source" feature will show the page as it was first rendered not after JavaScript has had a chance to modify the DOM.Why would you want it removed? Couldn't you instead then have a loading ... page, then redirect to the actual results page?
X-Istence
however it will still be in the sourcecode. right?
JPro
@ZombieSheep: He is already doing that with the JavaScript, hiding the element. He wants it gone when someone right clicks and views the source of the page.
X-Istence
I am using an image insted of 'loading' text, I do not want that heavy image to take up memory even after the page loads. SO thats why I want to delete that. If I use a temp page that has image and redirect to the page of actual results, then there is extra overhead of requests which I dont want either
JPro
Thank you very much
JPro
Consider accepting the answer - this is how this community works :)
Emil Ivanov