Facebook喜欢墙贴系统

I am planning to build a facebook like wall post system in my site. I am working on codeigniter mysql and jQuery.

Now here is my question: I am loading all posts once user come to home page. I created 2 more tables that is comments and like for like and comments of the posts.

If I am loading all posts using jQuery and json, how will I load all likes and comments of that particular post?

Here is my code:

Model

function load_all_activities()
    {
    $this->db->select('*')->from('activity_board');
    $this->db->order_by("created_time", "desc");
    $this->db->limit(20);
    $this->db->join('profile', 'profile.user_id = activity_board.user_id');
    $query = $this->db->get();

    $data=array();
     foreach ($query->result() as $row){     
     $row->createdtime=$this->timeago($row->created_time);
    // $row->age=$this->birthday($row->birthday);
     $data[]=$row;
     }

    return $data;
    //return $query->result(); 
    }

Controller:

function load_activities(){

    $data=$this->users->load_all_activities();


    echo json_encode($data);

    }

View:

//Jquery load activities posts
function load_activities(){

$.post("<?=base_url()?>home/load_activities", function(data){   

$(data).each(function(index, item) {
    $(item).each(function(index, value) {    
    $("#wallposts").append('<div id="postContainer"> <div id="postPic"><a href=""><img src="'+value.picture_thumb+'"/></a></div> <div id="postMsg"><a href="#"><b>'+value.first_name +'</b></a>&nbsp;' +  value.message+'<br/><br/><a href="#">Like</a> &middot; <a href="#">Comment</a> &middot; '+value.createdtime+'<div id="deleteMsg">X</div> </div></div>');
    });
 });




},"json");  

}

Here is my mysql tables

CREATE TABLE `activity_board` (
 `activity_id` int(11) NOT NULL AUTO_INCREMENT,
  `user_id` int(11) NOT NULL,
 `message` text NOT NULL,
 `created_time` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
 PRIMARY KEY (`activity_id`)
) ENGINE=MyISAM  DEFAULT CHARSET=latin1 AUTO_INCREMENT=6 ;




CREATE TABLE `activity_comments` (
`comment_id` int(11) NOT NULL AUTO_INCREMENT,
 `comment` text NOT NULL,
 `avtivity_id` int(11) NOT NULL,
 `user_id` int(11) NOT NULL,
 `created` timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP,
 PRIMARY KEY (`comment_id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ;

If you're going to build the html using js, you should consider using something like backbone.js or batman.js, these will allow you to build up templates and work in a more controlled manner. they're client-side MVC js frameworks that will provide a lot of power..

my two cents.. otherwise, i would prepend all the id's with the post id

eg.

post_id:20

<div class="postContainer" id="20">
  <table class="message" id="message_20></table>
  <table class="likes" id="likes_20></table>
  <table class="comments" id="comments_20></table>
</div>

Have you considered using a third party component such as DisQus which provides comments / activity on your webpages without having to implement much more than a custom HTML element and the inclusion of a javascript link?

You need to do a few things:

• Create models for your tables with methods that select rows from the tables based on an activity_id
• Create a PHP script which is called in some way like viewdetails.php?activity_id=<some id> which returns those comments and likes for a speicific activity id
• Your post container div needs to have some way to identify the post id. I usually do it by making the id of the div something like <div id="post_<post id>"> and using classes for the styling (ids should be unique, classes are shared between elements).
• You need a link inside the div that looks something like: <div id="<post id>_post"> ... other stuff ... <a href="#" class="viewCommentLikeButton">View Likes and Comments</a>
• You need to place in your $(document).ready() function $(".viewCommentLikeButton").click( function () { $.post('viewdetails.php?activity_id=' + $(this).parent().attr('id').substr(5), { }, someSuccessHandlerFunction ); });
• Your success handler function should parse your json and place it in some div with an id linked to the original activity_id (so something like $("#" + response.activity_id + "_comments").html(response.comments) if your json was put inside response and response.activity_id had the activity id in it and response.comments had the html for the comments in it)

I don't know if putting html into the json is the best practice, so you could also make your php script just return information about the comments and make your javascript parse it into something readable.