Question

Is it possible to refresh a divs content only if new content is added to the database?

I’m using this for “recent posts” that appear in the side menu.

Right now the div is set refresh every 10 seconds.

Is it somehow possible to check it a new post was added to the db and then add only that posts data to the div?

I’m using MySql, php and jquery to do all of this.

Answer 1

YES IT IS POSSIBLE

The below code will get the recent photos that has been added:

1. AFTER THE TIMER.PHP WAS LAODED (or your wordpress blog page)
2. AND ONLY AFTER A NEW PHOTO IS ADDED (you can use it for recent posts, comments, or anything)

This can be used to create a live blog for example, where the user will see all the recent comments, images or posts, or everything, even if he doesn’t reload the current page. And it won’t consume a lot of bandwidth as the content will be reloaded ONLY IF THERE IS NEW ADDED (it will only send a tiny check in the database otherwise).

I’ve just finished working out a solution for that, and I have to share it with you. I was doing it for WordPress, i needed a function that gets the photos that has been added ONLY after the user loaded the page. It could be done by simply refreshing the div every 5 seconds, but imagine if there were 20 photos, and they had to be refreshed every 5 seconds… that’s a lot of MB of data. So we will refresh them ONLY when a new photo is added (you can apply it to anything, from posts to comments or users, etc.).

There are 3 PHP files: timer.php, check.php and display.php.

The timer.php will load the check.php every 5 seconds, to check if new content is added. Notice the -6 extraction from the time of the current load of check.php.

The date-time of the timer.php will be passed (by check.php?tim=**print date) through the check.php (by **display.php?timm=’. $tizz .’) and to the display.php, so we can use it for a reference in our database (that will be the time from where we will load all the images, if new images are added).

If any questions, just ask. It has to work for you too, as it works for me.

ENJOY! 🙂

Below are the 3 PHP files, just customize them for your needs:

THE TIMER.PHP (or your wordpress blog pages):

<script type="text/javascript" src="jquery.js"></script>

<script type="text/javascript">
        $(document).ready(function(){


            setInterval(function(){
                $("#quotex a").load("check.php?tim=<?php print date("Y-m-d H:i:s"); ?>");
            }, 5000);

        });
        </script>

        <div id="quote"><a></a></div>


        <div id="quotex"><a></a></div>

THE CHECK.PHP :

 <?php 
     // Connects to your Database 
     mysql_connect("localhost", "username", "password") or die(mysql_error()); 
     mysql_select_db("database name") or die(mysql_error()); 



     // SQL query
        $strSQL = "SELECT * FROM wp_posts WHERE   post_mime_type LIKE 'image/jpeg' ORDER BY `wp_posts`.`id`  DESC LIMIT 1";

        // Execute the query (the recordset $rs contains the result)
        $rs = mysql_query($strSQL);

        // Loop the recordset $rs
        // Each row will be made into an array ($row) using mysql_fetch_array
        while($row = mysql_fetch_array($rs)) {

        $atime = $row['post_date'];

    $tizz = $_GET['tim'];    

    $dsff = $row['post_date'];;

    $duff = date("Y-m-d H:i:s");

    //convert the date-time into seconds so we can extract 6 seconds from it
    $six = strtotime(date("Y-m-d H:i:s"))-6; 

    //convert the latest image date-time too from database so we can compare it
     $sox = strtotime("$dsff");

     if ($six < $sox)
      {
      echo '<script type="text/javascript">$(document).ready( function(){ $("#quote a").load("display.php?timm='. $tizz .'"); } ); </script>';
      }
          }

        // Close the database connection
        mysql_close();


     ?>

THE DISPLAY.PHP:

<?php 
$tipp = $_GET["timm"];
 // Connects to your Database 
 mysql_connect("localhost", "username", "password") or die(mysql_error()); 
 mysql_select_db("database name") or die(mysql_error()); 




 // SQL query
    $strSQL = "SELECT * FROM wp_posts WHERE   post_mime_type LIKE 'image/jpeg' AND post_date > '$tipp' ORDER BY `wp_posts`.`id`  DESC LIMIT 10";
    // Execute the query (the recordset $rs contains the result)
    $rs = mysql_query($strSQL);

    // Loop the recordset $rs
    // Each row will be made into an array ($row) using mysql_fetch_array
    while($row = mysql_fetch_array($rs)) {
    //guid is the column where the image url is located in the wordpress database table
    $atime = $row['guid'];

     echo "<img src='". $atime ."' /><br />";
      }
    // Close the database connection
    mysql_close();


 ?>