automatic refresh of only specific <div> element of a page in jquery

javascript, jquery, php

Solution

I would use a timestamp, as it doesn't need to get latest insert id of every update.

var timestamp = 0;

setInterval(function(){
    $.ajax({
        url:"confess_show.php?t=" + timestamp,
        type:"GET",
        dataType:"html",
        success:function(data){
            if(data != ''){ //Only append data if there are some new
                timestamp = Math.round((new Date()).getTime() / 1000); //Set timestamp to current time
                $('.content').append(data);
            }
        }
    });
}, 6000);

confess_show.php should then only fetch rows with a timestamp larger than $_GET['t']. That way, you don't need to keep track of the latest id shown.

Problem

How to refresh content of particular element instead of whole page, after some interval using Jquery? When I used code shown below, its only appending same data several times after defined time duration, but I don't want this, I want only that data should be append if any new data inserted by user in mysql. ``` setInterval(function(){ $.ajax({ url:"confess_show.php", type:"GET", dataType:"html", success:function(data){ $('.content').append(data); } }); }, 6000); ```

Original source