Refreshing php script inside a div

Question

I am currently using the following script to refresh my messages.php in a div with a timeinterval of 60 seconds.

<script> jQuery().ready(function(){ setInterval("getResult()",60000); }); function getResult(){ jQuery.post("messages.php",function( data ) { jQuery("#msgs").html(data); }); } </script> <div id="msgs"> </div>

My current problem is that the echo of the php file displays for the first time after the 60 seconds passed. Then it refreshes every 60 seconds. I need to get the code to load at the start of launching the page.

jQuery(getResult);would call it once document is ready. FYI, this is preferred syntax: setInterval(getResult, 60000); avoiding string evaluation — A. Wolff
– A. Wolff, Commented Feb 11, 2015 at 8:48
just add getResult(); BEFORE your setInterval, so that it will be executed once and, then, executed each 60 seconds — briosheje
– briosheje, Commented Feb 11, 2015 at 8:48

void · Accepted Answer · 2015-02-11 08:49:40Z

Call getResult() on DOM Ready as well

<script> jQuery().ready(function(){ getResult(); setInterval("getResult()",60000); }); function getResult(){ jQuery.post("messages.php",function( data ) { jQuery("#msgs").html(data); }); } </script> <div id="msgs"> </div>

Blizz · Accepted Answer · 2015-02-11 09:08:58Z

I would just use a setTimeout every time:

<script> jQuery().ready(function() { function getResult() { $('#msgs').load('messages.php', {}); setTimeout(getResult, 60000); } getResult(); } </script> <div id="msgs"></div>

Alternative with re-fire in the callback (suggestion of A. Wolff, in case messages.php takes long to complete):

<script> jQuery().ready(function() { function getResult() { $('#msgs').load('messages.php', {}, function() { setTimeout(getResult, 60000); }); } getResult(); } </script> <div id="msgs"></div>

Good call on passing data to load method and using a timeout, even i'd use the complete load method callback, just in case the request takes more than 60 sec to complete
Nice idea. I'll add an alternative based on your suggestion.

HackerGK · Accepted Answer · 2015-02-11 08:50:07Z

<script> jQuery().ready(function(){ getResult(); setInterval("getResult()",60000); }); function getResult(){ jQuery.post("messages.php",function( data ) { jQuery("#msgs").html(data); }); } </script> <div id="msgs"> </div>

Use this code..

Kartikeya Khosla · Accepted Answer · 2015-02-11 08:54:49Z

In order to get data on page load, call getResult() on DOM ready event as shown below :-

<script> jQuery().ready(function(){ getResult(); //it will get data as soon as page is loaded. setInterval("getResult()",60000); // it will refresh #msgs after every 1 min. }); function getResult(){ jQuery.post("messages.php",function( data ) { jQuery("#msgs").html(data); }); } </script> <div id="msgs"> </div>

Collectives™ on Stack Overflow

Refreshing php script inside a div

4 Answers 4

1 Comment

2 Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

2 Comments

Comments

Comments

Related