Auto refresh MySQL Query results in PHP - php

Question

I have these DIVS which run PHP functions and return results. How can i make the returned results automatically refresh every X seconds without refreshing the whole page.
I just want to re-run the PHP/MySQL queries that are in the functions
<div class="container">
<div class="box"><h2>Callers Waiting</h2><?php echo CallersWaiting($queue_name, date('Y-m-d H:i:s', strtotime('-1 hour'))); ?></div>
<div class="box"><h2>Average Hold Time</h2><?php echo AverageHoldTime($queue_name, $date); ?></div>
<div class="box"><h2>Longest Wait Time</h2><?php echo LongestWaitTime($queue_name, $date); ?></div>
<div class="box"><h2>Shortest Wait Time</h2><?php echo ShortestWaitTime($queue_name, $date); ?></div>
</div>
UPDATE:
I have used this code:
<div class="container"></div>
<script type="text/javascript">
$(document).ready(function(){
refreshTable();
});
function refreshTable(){
$('.container').load('data.php', function(){
setTimeout(refreshTable, 2000);
});
}
</script>
then all my divs and PHP Functions run on a page called data.php but nothing is showing on my index.php page

Answer 1

<meta http-equiv="refresh" content="5; URL=http://www.yourdomain.com/yoursite.html">
regresh page after 5 sec and if you need js i can send it too
setTimeout(function(){
window.location.reload(1);
}, 5000);
For ajax you need a page that return all you data in Json or xml form.
then you need to make $.POST or $.GET or $AJAX request to that page and then parse it and then update your html elements.
example
http://danielnouri.org/notes/2011/03/13/an-ajax-page-update-mini-tutorial/

Answer 2

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">// <![CDATA[
$(document).ready(function() {
$.ajaxSetup({ cache: false }); // This part addresses an IE bug. without it, IE will only load the first number and will never refresh
setInterval(function() {
$('.container').load('data.php');
}, 2000); // the "3000" here refers to the time to refresh the div. it is in milliseconds.
});
// ]]></script>
<div class="container">Loading data ...</div>

Answer 3

If you need to refresh a page when clicking on a div, you can use AJAX Poll, but if you want to update the element every specific period, your code must be like so
$(document).ready(function () {
setInterval(function () {
$.ajax({
url: 'data.php',
type: 'get',
dataType: 'json',
success: function (data) {
$("#your-element-id").html(data.your_data);
},
error: function (ERROR) {
console.log(ERROR);
}
});
}, 2000); // trigger this function every 2 sec.
});