I am new to AJAX but I have managed to get most of what I need done with AJAX on my site; except one thing that is still eluding me.
I am using ajax to post any new entries to the sites DB to the web page in random places (via DIVs). As I add the data to the database I get the resulting info shown on the screen via the periodicalupdater
function just fine but as I add new items to the DB the old displayed data is removed and the new data is then displayed even though it is in a different location on the screen. Is there anyway to keep the old displayed data on the screen using the periodicalupdater
function while adding new data using periodicalupdater
? Thanks for any help in advance. PS, The data I am displaying contains unique DIV positioning coordinates. Below is the code I am using
note: prototype.js
is already loaded
this is the function called
function checkping()
{
var <?php echo $holder;?> = new Ajax.PeriodicalUpdater('newPing','my.php', {method: 'post', frequency: 3.0, decay: 1});
}
</script>
this is the calling script
<script language="javascript" type="text/javascript">
checkping();
</script>
this is what is sent back to the ajax call via my.php. note the variables for top and left vary with each record posted.
<?php
echo
"<div style=\"position:absolute;
visibility:visible;
width:160px;
height:48px;
top:",$top_coord,"px;
left:",$left_coord,"px;
background-color:",$bgrcolor,";
border:2px solid #000000;
z-index:1\">
<img src=\"images/flags/",$flagfilename,"\" alt=\"country flag\" width=\"60\" height=\"32\" align=\"left\"><font size=\"-3\">", $usr_name, "
From: ",$country, "
", $pingText, "</font></div>";
?>