Update live for post and comments like facebook

[sarahaziz]

Dear all,
i found this post online so useful but now i have a problem i want to update live the posts and comments without having to reload (i.e. between 2 instances of browsers). How can i do that?
http://www.9lessons.info/2011/05/fac...h-php-and.html

[ZABI]

Ajax

[sarahaziz]

Thanks for your reply i do understand that it is Ajax but the idea itself isn't clear and is it doable or not?

[George88]

Using an AJAX call in an interval can easily achieve this. You'll need to set-up an interval with a function that can request PHP to query the database like so:

window.addEventListener
(
    "load", 
    function()
    {
        var update = setInterval
        (
            get_data();
        ), 1000
    }, false 
);

function get_data()
{ 
    // IE7+, Firefox, Chrome, Opera, Safari.
    if (window.XMLHttpRequest)
        xmlhttp = new XMLHttpRequest();
    // IE6, IE5.  
    else
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
 
    xmlhttp.onreadystatechange = function()
    {
        if(xmlhttp.readyState == 4 && xmlhttp.status == 200)
        {
            // Handle HTTP response here.
            console.log(xmlhttp.responseText);
        }
    }
 
    xmlhttp.open("GET", "some_page.php, true);
    xmlhttp.send();
}

[sarahaziz]

First of all thanks George for your reply.
Second i do know that i should use Ajax it is the idea itself that i can't seem to implement and i am so blocked , could you just take a look at the post and tell me how can i update automatically the data.

[ZABI]

Can you please post the code ? where are you blocked. asy to pta nhi chalay ga.

[sarahaziz]

Ok here what i did is steps:
1- I get all the data at the beginning.
2- Keep the last message id on page
3- Get messages that their ids are higher than the number saved and then post them to page (i can repeat this using setTimeout javascript function and in that case it would be automatically updated and posted to the other users)
4-Now regarding the comment or reply to post how could i do the same

This is the function i use to get all data at start

  
      function displayMsgs()
     {
	$.ajax({ 
		type: "post", 
		url: "includes/getMsgs.php",
		dataType: "xml" ,
		success: function(data){
	    $(data).find("message").each(function() {
	     var msg_id = $(this).find("msg_id").text();
	     var msg_body = $(this).find("msg_body").text();
	     var msg_user = $(this).find("msg_user").text(); 
	     var msg_type = $(this).find("msg_type").text(); 
	     var user_id = $(this).find("user_id").text(); 
   	     var active_user_id = $("#active_user_id").val();
        
         var html  = '<div media="true" class="stream-item " id="'+msg_id+'">';
         html  += '<input type="hidden" value='+active_user_id+'></input>';
         html  += '<div class="stream-item-content tweet stream-tweet " html -user-id="1921671">';
         html  += '<div class="tweet-content">';
         html  += '<div class="tweet-row">';
         html  += '<span class="tweet-user-name">';
         html  += '<a class="tweet-screen-name user-profile-link" html>'+msg_user+'</a>';
         html  += '<span class="tweet-full-name"></span></span>';
         html  += '<div class="tweet-corner">';
         html  += '<div class="tweet-meta">';
         html  += '<span class="icons">';
         html  += '<div class="extra-icons">';
         html  += '<span class="inlinemedia-icons"></span>';
         html  += '</div>';  
         html  += '</span>';
         html  += '</div>';
         html  += '</div>';
         html  += '<div class="tweet-row">'+msg_body+'</div>';
         html  += '<div class="tweet-row">';
         html  += '<a class="tweet-timestamp" title=><span ></span></a>';
         html  += '<span>';
         html  += '</span>';
         html  += '<span >';
         html  += '</span><b> Msg ID '+msg_id+' '+msg_type+'</b>';
         html  += '</div><div class="tweet-row">';          
         html  += '</div>';
         html  += '</div>';
         html  += '</div>';
         $("#stream-items").append(html);
	}); 
  }
});
}

This is the code to save a message

function saveMsg()
{
	var msg = $("#msg_area").val();
	var id = $("#msg_id").val();
	 $.post("includes/saveToDB.php","msg_id="+id+"&msg_body="+msg,function(data)
	 {
	   $("#msg_area").val("");
	     $(data).find("message").each(function() {
	     var msg_id = $(this).find("msg_id").text();
	     var msg_body = $(this).find("msg_body").text();
	     var msg_user = $(this).find("msg_user").text(); 
	     var user_id = $(this).find("user_id").text(); 
   	     var active_user_id = $("#active_user_id").val();
         
         var html  = '<div media="true" class="stream-item " html -item-type="tweet" id="'+msg_id+'">';
         html  += '<input type="hidden" value='+active_user_id+'></input>';
         html  += '<div class="stream-item-content tweet stream-tweet " html -user-id="1921671">';
         html  += '<div class="tweet-content">';
         html  += '<div class="tweet-row">';
         html  += '<span class="tweet-user-name">';
         html  += '<a class="tweet-screen-name user-profile-link" html>'+msg_user+'</a>';
         html  += '<span class="tweet-full-name"></span></span>';
         html  += '<div class="tweet-corner">';
         html  += '<div class="tweet-meta">';
         html  += '<span class="icons">';
         html  += '<div class="extra-icons">';
         html  += '<span class="inlinemedia-icons"></span>';
         html  += '</div>';  
         html  += '</span>';
         html  += '</div>';
         html  += '</div>';
         html  += '<div class="tweet-row">'+msg_body+'</div>';
         html  += '<div class="tweet-row">';
         html  += '<a class="tweet-timestamp" title=><span ></span></a>';
         html  += '<span>';
         html  += '</span>';
         html  += '<span >';
         html  += '</span><b> Msg ID '+msg_id+'</b>';
         html  += '</div><div class="tweet-row">';          
         html  += '</div>';
         html  += '</div>';
         html  += '</div>';
         $("#last_screen_id").val(msg_id);
	    $("#stream-items").prepend(html);
	   });
	 });
}

This is PHP code to get all data at beginning

$sql = mysql_query('select msg_id,msg_body,user_name,user_id
                    from messages , users
                    where user_id = from_user
                    order by msg_id desc') or die (mysql_error());
 while ($result = mysql_fetch_array($sql))
{
   $msg_body_array[] = $result['msg_body'];
   $msg_id_array[] = $result['msg_id'];
   $msg_user_array[] = $result['user_name'];
   $msg_type[] = $result['msg_type'];
   $msg_user_id[] = $result['user_id'];
   
   $sql_replies = mysql_query("select reply_id,reply_text,user_name,from_user
                              from replies as r , users
                              where parent_id = ".$result['msg_id']."
                              and from_user = user_id
                              order by reply_id desc") or die(mysql_error());

 while ($result_replies = mysql_fetch_array($sql_replies))
  {
      $msg_body_array[] = $result_replies['reply_text'];
      $msg_id_array[] = $result_replies['reply_id'];
      $msg_user_array[] = $result_replies['user_name'];
      $msg_user_id[] = $result_replies['user_id'];
   }
  } 
      $xml = new dab_XML_Builder('text/xml', 'utf-8');
      $xml->add_group('messages');

     for ($i=0;$i<count($msg_id_array);$i++)
     { 
        $xml->add_group('message'); 
        $xml->add_tag('msg_id', $msg_id_array[$i]); 
        $xml->add_tag('msg_body', $msg_body_array[$i]); 
        $xml->add_tag('msg_user', $msg_user_array[$i]);
        $xml->add_tag('user_id', $msg_user_id[$i]); 
        $xml->close_group(); 
     }   
         
        $xml->close_group();  
        $xml->print_xml();
        mysql_close(); 

Now i want to do the same with the comment for each post how can i do so?

[ZABI]

i am confused about ur problem, wait until someone posts a solution for ur problem.

[sarahaziz]

I don't understand this language

[ZABI]

i am confused about ur problem, wait until someone posts a solution for ur problem.