Jump to content

PHP/jQuery Auto-Refresh: Only Fade-In New Rows in Database Since Last Refresh


CloudSex13

Recommended Posts

Hi all,

 

Thanks for reading.

 

I'm running a script using jQuery that auto-refreshes a <div> on the index page from an external PHP script to get all the rows in a database and display them on the index page. The script works great - here it is as follows:

 

<script type="text/javascript">

$(document).ready(function() {

$("#responsecontainer").fadeOut("fast").load("getrows.php").fadeIn("slow");

var refreshId = setInterval(function() {
$("#responsecontainer").fadeOut("fast").load('getrows.php').fadeIn("slow");
}, 5000);

$.ajaxSetup({ cache: false });

});

</script>

 

The getrows.php script I'm working with looks like this:

 

<?php 

$rowsQuery = mysql_query("SELECT * FROM Happenings WHERE HappeningDate='$today'");

if (mysql_num_rows($rowsQuery) == 0) {
$happeningsToday = "There are no happenings today.";
} else {

$allHappeningsToday = 1;

while ($getHappeningsToday = mysql_fetch_array($rowsQuery)) {

$happeningName = stripslashes($getHappeningsToday['HappeningName']);
$happeningDate = $getHappeningsToday['HappeningDate'];
$happeningDescription = $getHappeningsToday['HappeningDescription'];

if ($allHappeningsToday == 1) {

$happeningsToday .= "
<div class=\"box\">
<p>".$happeningName." | ".$happeningDate." | ".$happeningDescription."
</div>";

$allHappeningsToday = 2; 

} else { 

$happeningsToday .= "
<div class=\"box\">
<p>".$happeningName." | ".$happeningDate." | ".$happeningDescription."
</div>";

$allHappeningsToday = 1; 

}

}

}

echo $happeningsToday;

?>

 

This script works great as well.

 

Currently, the auto-refresh jQuery script as you can see if getting and fading in/out all of the rows.

 

Off of the above getrows.php script, is there a way after I could get only the newly created rows since the last refresh and only fade those in and out while leaving the others already loaded by the auto-refresh script to not fade in/out?

 

Any ideas, thoughts or suggestions would be unbelievably helpful.

 

Thank you very much. :)

Link to comment
Share on other sites

I came up with an idea of adding a field to the Happenings table in my database called HappeningTodayDisplayed. If it's set to 1, then the auto-refresh script should not fade in/out. But, if HappeningTodayDisplayed is set to 0, then is should fade in/out.

 

I placed these queries separately in the getrows.php file using the GET method, and have links like the following:

 

<script type="text/javascript">

$(document).ready(function() {

$("#responsecontainer").load('getrows.php?alreadydisplayed');

var refreshId = setInterval(function() {
$("#responsecontainer").fadeOut("fast").load('getrows.php?justadded').fadeIn("slow");
$("#responsecontainer").load('getrows.php?alreadydisplayed');
}, 5000);

$.ajaxSetup({ cache: false });

});

</script>

 

However, I'm frustrated to see this only displays the events already displayed...

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.