How to Ajax auto refresh after x seconds
11 Votes, Rating: 4.55
Update your contents after x seconds with ajax setInterval function
Realtime Listing, going very popular, every guy searching for that, i have also spend lot of time to search the way to refresh page every x seconds. so i can update my ajax listing with new added records.
after long search and try many method i found javascript function setInterval, all realtime listing works with it. i guess.. if not wrong 
Use of setInterval function
just alert “hello San” to test this function
setInterval( "alert('Hello San')", 5000 ); ///////// 5 seconds
Example: just alert “hello San” to test this function after 10 seconds
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script>
<script language="JavaScript">
setInterval( "alert('Hello San')", 10000 );
</script>User it for call your main function.
setInterval( "SANAjax();", 10000 ); ///////// 10 seconds
Example : With jquery,update div contents after 5 seconds
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.0/jquery.min.js"></script> <script language="JavaScript"> setInterval( "SANAjax();", 5000 ); ///////// 10 seconds $(function() { SANAjax = function(){ $('#dataDisplay').prepend("Hi This is auto refresh example for you - w3cgallery.com <br><br>").fadeIn("slow"); } }); </script>
The code above will run every 10 seconds (10,000 ms)
i will call your function SANAjax();
enjoy
September 5th, 2009 at 1:42 pm
thanks..ive been searching for the same thing..but a live example would really help
September 9th, 2009 at 8:27 am
Andrew, on your demand, demo is ready for you
December 13th, 2009 at 2:19 am
and the code?
December 14th, 2009 at 6:09 am
see above
January 21st, 2010 at 11:03 am
Nice code , Workign fine
April 19th, 2010 at 7:17 am
nice , quick & fast example ! all that I like
May 10th, 2010 at 8:17 pm
would it be possible to use this to refresh the content of a php page? if so how? i been trying to work this out for ages
May 11th, 2010 at 7:05 am
Yes its possible.
you need to do these. 1 make a function with ajax and connect with php pages to bring data and display in any div.
2nd add above function to refresh function. it will refresh and ajax function brings data from php page.
is it ok ?? if not let me know. i will write a post for it
May 11th, 2010 at 10:36 am
Hey SAN…
That would be fantastic if you could, also if you do, could you give me a buzz in my email provided.
Thanks guys,
Alec
May 11th, 2010 at 10:39 am
Hry, me again..
I would of thought that it would be something like this:
setInterval( “SANAjax();”, 5000 ); ///////// 10 seconds
$(function() {
SANAjax = function(){
$(’#dataDisplay’).html(”LOCATION OF PHP FILE”).fadeIn(”slow”);
}
});
Am I going in the right direction here?
Thanks guys, Alec
July 19th, 2010 at 5:57 am
what about add a checkbox to disable or enable those auto refresh ?
if unchecked it will be autorefresh, if checked it will stop the autorefresh ?
August 14th, 2010 at 11:14 pm
hey, i want to refresh just a part of the webpage, for example a chatbox - i wouldn’t want the whole page to be refreshing every 5sec but just the chatbox.. any ideas?
August 16th, 2010 at 7:36 am
you need to use div for chatbox, or use iframe, i guess so
August 31st, 2010 at 12:56 pm
Thank youuuuuuuuuuuuuu
Thought there was no hope till I found this post
=)