Question

I have method to update notification and when update it return number of notification and content of notification with json type

{
    "friend_request": 4,
    "request": [{
        "user_id": "1",
        "picture": "/home/sepdau/",
        "name": "Le Chanh"},
    {
        "user_id": "2",
        "picture": "",
        "name": "Yii PHP"},
    {
        "user_id": "4",
        "picture": "13366396884.jpg",
        "name": "Minh Le"},
    {
        "user_id": "11",
        "picture": "",
        "name": "Thang Phan"}]
}​

When I receive I update number of notification success

function updateNotification(){        
    $.ajax({
        url: '/nevergiveup/index.php/site/updatenotification',
        type: "post",
        dataType: "json",
        success: function(data){            
            if(data.friend_request>0){
                $(".zingcounter").text(data.friend_request); //update number of nofitcation
                // load the template file, then render it with data
                var html = new EJS({url: '/nevergiveup/jstemplates/friend_request.ejs'}).render(data);
                //$("#frlist").append(html);
                //$(html).replaceAll('#replacehere');
                $('#replacehere').replaceWith(html); // update content of notification
            } 
            setTimeout(updateNotification,10000);
        },
        error: function(){
            setTimeout(updateNotification,10000);
        }
    });       
}

I use EJS to build a template of content
I have a <div id="replacehere"> to replace my content here
I use $('#replacehere').replaceWith(html); to replace but it success when first request in 10s after
I see json data receive has a new content and number of notification has change but content not change.
How to change it when receive new content.

Answer 1

Guess you need just use

$('#replacehere').html(html);

otherwise it will remove #replacehere div… and second request wont find it to put content in…