Auto refresh MySQL Query results in 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

AJAX is what you need. You can't do this purely with PHP, as PHP runs server-side. — Brad, Mar 17 '14 at 21:19
do you have an example in ajax? I have only ever used PHP & HTML — , Mar 17 '14 at 21:20
http://stackoverflow.com/questions/5681380/refresh-a-table-with-jquery-ajax-every-5-seconds — Patrick Q, Mar 17 '14 at 21:25
if i use that code i will have to have a separate page for each function — , Mar 17 '14 at 21:26
No you wouldn't. You'd just need one page that calculates all of the values and sends them back (either already in the desired HTML, or in a format like JSON that you can parse and put the pieces where they go). — Patrick Q, Mar 17 '14 at 21:31

m-farhan · Answer 1 · 2014-03-17T21:26:43.637

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

edited Mar 17 '14 at 21:26

answered Mar 17 '14 at 21:21

m-farhan

1,436
13
14

i don't want to refresh the whole page – Mar 17 '14 at 21:21
1

true that is right way to do it. how ever it will be complicated. You need ajax or jquery – m-farhan Mar 17 '14 at 21:23
do you have an example? – Mar 17 '14 at 21:24

score -1 · Answer 2 · answered Mar 17 '14 at 21:47

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

score -1 · Answer 3 · answered Aug 10 '22 at 14:33

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.
});

score -1 · Answer 4 · answered Aug 23 '23 at 16:47

Assuming that data.php is something like this:

//require whatever you need for the functions to operate properly

$queue_name = $_POST["queue_name"]; //assuming that you have a queue_name post parameter

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

You could send an AJAX request like this:

$.post('data.php', { queue_name: "<?php echo $queue_name ?>"}, 
    function(data){
         $(".container").html(returnedData);
}).fail(function(){
      console.log("error");
});

Of course, if data.php does other things, then you may need to check whether it's POST or not or implement a new PHP file for your POST requests.

Auto refresh MySQL Query results in PHP

4 Answers4