Refreshing DIV content with AJAX

Normally, when we need to update the certain part of the page we do refresh the whole page. But it seems to be inefficient when we need to update a small portion of the page and we are refreshing the whole.Using the div tag in the page or tableless page have made easy for programmer to refresh a portion or division by using DIV with AJAX.

Here i have taken an example to show how to use AJAX in DIV.

In the example, there are three files (in the same folder):
ajax.js
index.html
boo.php

ajax.js should contain


and second file “index.html” contains the div to be refreshed


// this is going to be refreshed -->

third file “boo.php” that contains the php code to read time from the system.


Although the content of this file could have been any, I decided it to be a PHP function (gmstrftime) which requests the current time and formats it. Every time the DIV is refreshed, the function returns the current time formatted; therefore you can clearly see that the example works, as the time will keep refreshing every 5 seconds.

The result, once you completed the example, should look like this:
This is the current date and time (updates every 5 seconds):
It is Thru on Oct 22,2009,16:03:50 – Time zone :GMT

You can change the code of boo.php to whatever you wish to try new things…


One Comment