Forum Moderators: open

Message Too Old, No Replies

Refresh the content of a DIV

I know, I know...

         

shs_cmcl

8:18 pm on Feb 12, 2008 (gmt 0)

10+ Year Member



I swear, I've Googled, honest. I've been looking around for the past couple of days, just trying to find a very, very, very simple way to refresh the contents of a DIV on a page. I get that I will pretty much have to use AJAX and I've been looking at the basics of it, but I'm still very much of a beginner and the various examples I've seen either don't quite do what I want and I can't figure out how to customize them, or they look perfect but I'm missing some trivial piece of info...

I've just got a plain page, index.php:

<P>Blah blah blah.

<DIV ID="mydiv"><?php include('otherpage.php');?></DIV>

<P>Blah blah blah blah blah.

All I want is for that DIV to refresh every 30 seconds or so, without refreshing the rest of the page and without using an IFRAME. The "otherpage.php" contains information pulled from a MySQL database, so it'll update periodically and I'd like it to appear "semi-live" inside that DIV on index.php.

One of the only things I've found here on this site is this older thread [webmasterworld.com], but it didn't provide any examples, and I may require a little more handholding. Any takers? I would be very grateful.

Diagon

7:45 pm on Feb 14, 2008 (gmt 0)

10+ Year Member



I'll admit that I'm pretty new to AJAX myself, but I've had success using the following steps:

1. in the initial page setup, keep the contents of the containing DIV empty.
2. change the contents of the PHP page to ONLY include the content you would like viewable in the containing DIV. Meaning make sure it is not sending any DOCTYPE, html, body, or header tags.
3. on page load call a function that creates an XMLHttpRequest object and sends it to the PHP page you just created. The return function should then first check to make sure the innerHTML of the containing DIV is empty, and if not, clear it. At that point, jsut set the innerHTML = XMLHttpRequest.responseText.
4. recursively call the function every 30 seconds.

Hope that helps!

shs_cmcl

6:08 pm on Feb 15, 2008 (gmt 0)

10+ Year Member



Thanks for the tip! I'm still playing with it.

Diagon

12:23 am on Feb 16, 2008 (gmt 0)

10+ Year Member



Not a problem. Let us know how it works out!