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

1

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>

answered Feb 11, 2015 at 8:49

void

36.8k10 gold badges72 silver badges111 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

briosheje Over a year ago

missing semicolon after getResult().

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

1

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>

edited Feb 11, 2015 at 9:08

answered Feb 11, 2015 at 8:56

Blizz

8,4482 gold badges36 silver badges54 bronze badges

2 Comments

A. Wolff Over a year ago

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

Blizz Over a year ago

Nice idea. I'll add an alternative based on your suggestion.

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

0

<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..

answered Feb 11, 2015 at 8:50

HackerGK

3703 silver badges15 bronze badges

Comments

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

0

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>

edited Feb 11, 2015 at 8:54

answered Feb 11, 2015 at 8:49

Kartikeya Khosla

18.9k8 gold badges46 silver badges70 bronze badges

Collectives™ on Stack Overflow

Refreshing php script inside a div

4 Answers 4

1 Comment

2 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

1 Comment

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related