会话清单系统

i am actually building a conversation system and i have a page that displays all of the User's conversations, and allows him to select which one he wants to reply to, the general design is as follows:

I uploaded an image of the general structure here:

http://tinypic.com/r/2myvhno/8

So its like conversation lists one column, and the conversation itself takes the right column. When the user clicks on the conversation, then the correct conversation on the right hand side will pop out, so i think this will need some ajax to not refresh the page while sending the php code over to query the database for the conversation based on the id.

So the general functionality works like this:

  1. User selects conversation, conversation displays on right.
  2. User selects another conversation, conversation on the right changes.

I am fine with the php and querying database to get the conversation but not familiar with the ajax/javascript and html needed to allow users to select conversations, and for the correct conversation to display.

Thanks a lot.

I assume you are getting the conversation by a "#user_id". and do as follows

You need something like this, 1) give an id to right, say "#right"

2) after including necessary jquery library, get the click event of particular user

$(document).on("click", "#user_id", function(){
    var user_id = $(this).attr('id_of_particular_user'); //you are getting the user id here
     var request = $.ajax({
                        url: "your_path_to_a_php_file_that_gives_you_the_conversation.php",
                        type: "POST",
                        data: { user_id: user_id },
                        beforeSend: function(){
                            self.html("loading please wait...");
                        }
                    });

    //WHEN SUCCESS
    request.success(function( data ) {
        $("#right").html(data); //this line will replace the right with echoed content from php file
    });
});
  1. your_path_to_a_php_file_that_gives_you_the_conversation.php here echo the conversation as html code, like echo "<li>conversation line</li>";