how to force refresh of included php when database is updated

Question

I have a php page and in the middle of the page there is a second php page included, similar to below:

<?php
main content page
<?php include 'db-info.php';?>
more content
?>

db-info.php displays a table with information from a database. When the database is updated, I would like the main page to show the updated results. If I have the db-info.php page as a stand-alone page I can make it refresh, but I don't know how to make the db-info.php refresh when it is included in the main content php page.

I would prefer not to constantly scan for changes to the database to trigger the refresh because the database is only updated when a button is clicked. Any ideas for how to link the button click or the database update to make the db-info.php page refresh?

===== edit below ====

Thanks Kaleb and Steven I appreciate your advice. Even though the user clicks a button on the same page where the database info is displayed, the button is created like with document write syntax (this editor won't let me put the actual button code in) the button click triggers a function on a separate javascript file. Kaleb, I can re-write the way that the database information is displayed on the main php page but the main php page does not know that the database has been updated, unless I constantly check the database. The problem is how to trigger the refresh on the main page when the button is clicked or the database is updated. I don't know how to capture that event or whatever to do whatever is needed. The db-info.php page updates when the button in clicked and the database is updated. The db-info.php page is updated but the main content php page still continues to display the same (outdated) db-info.php page that loaded when the main php page was originally loaded.

================= update =====================

I moved the button so that it is on the main content php page. The button triggers the javascript to update the database. Now, since the button is on the same page that has

<?php include 'db-info.php';?>

I should be able to do two things with the onclick, run the javascript and somehow onload and re-load the db-info.php page??? maybe?

============ update ===================== I will re-write the main content php page to build the database info table right into the main page. I will still need a way to refresh that data separately from the entire main page content.

============= please mark this question as answered ===========

I apologize for the lack of clarity in my original question. Also, at first didn't understand the answers that were given but now I realize that they were pointing me in the right direction. Thanks again for the help. I plan to re-write the main content page to display the database info in the innerHTML of a div per the example here:

http://www.w3schools.com/php/php_ajax_database.asp

the db info will be displayed in this div

<div id="dbInfoHere">Database info will be listed here</div>

using this ajax to get the updated info from the database

document.getElementById("dbInfoHere").innerHTML = xmlhttp.responseText;
xmlhttp.open("GET","save-rankings.php?q="+str,true);

in the example, the javascript is called with a select onchange event I can call the javascript from a button onclick event

Answer 1

Option #1

If you want a simple ajax update, say, when the user presses a refresh button try using jQuery's .get or .post methods

http://api.jquery.com/jquery.get/

$.get( "ajax/test.html", function( data ) { $( ".result" ).html( data ); alert( "Load was performed." ); });

Option #2

If your looking for real time or "Push" updates, you'll need websockets and mysql triggers. You'll need a "daemon" script to handle your connections and you'll need to notify that script some how that the database has changed.

check out http://dev.mysql.com/doc/refman/5.1/en/create-trigger.html#c10251 for a starting point on your mysql triggers

and check out How to create websockets server in PHP for a starting point on your daemon service.

Option #3 Another option for "Real Time" depending on how many users you need to accommodate and your server stats is to do a "Pull" method. In this case you use a javascript timer to do the ajax request mentioned in option 1 every X amount of seconds.

This is a lot easier then building a push service or integrating with an existing one but the draw back is obviously if there is no new data then the users are making unnecessary requests to the server and also technically this is not "Real Time" as it only updates as fast as you set your timer

--- UPDATE ---

Your refresh button needs to be outside of the element thats being refreshed. So I would recommend something like this:

<div> 
   <button onclick="updateData();">Refresh</button> 
</div> 
<div id="dataContainer"> 
    <?php include "db-info.php"; ?> 
</div>

<script> 
function updateData(){    
     $.get( "db-info.php", function(data ) {       
        $( "#dataContainer" ).html( data );    
      }); 
}; 
</script>

Also I would try to avoid doing the extra ajax callback onload to load the initial data, unless there is a reason for it. By using the php include for the initial page load, your saving your self at least 1 extra request per page load.

Answer 2

First off, don't nest php tags. That'll cause the page to fail.
Second, using AJAX is how you'd do that without a page refresh. You'll just use AJAX to get data from the page and then display it.

PHP Page:

<?php

$data = array(
    "message": "This is JSON data"
);

echo @json_encode($data);

JavaScript:

 $(function()
{
    var jdata = { "task": "do_something" };
    $.get('db-info.php', {data: jdata}, function(data)
    {
        // PHP script returns JSON data.
        // message is an object that's returned
        // and added to the data object.
        alert(data.message);
    });
});