Как организовать MSG в чате, как WhatsApp, используя PHP, AJAX

Question

Как упорядочить сообщения в окне чата, например, WhatsApp

Ниже мой php-код для списка отправки сообщений, но в настоящее время в нем перечислено только то, как сделать его похожим на чат (список альтернативно) ** ** и мой чат будетНе обновлять входящее сообщение автоматически. Нужно обновить

public function ajax_chats($id)
{
    $list = $this->users->get_msg_byid($id);
    $data = array();
    foreach ($list as $users) 
    {
        $row = array();
        $user_id = $this->session->userdata('UserId');

        $row[] = '<div class="right"><p>'. $users->Content.'</p><span class="time-right">11:00</span></div>';

        $data[] = $row;
    }

    $output =  $data;
   echo json_encode($output);
}

Ajax

function chat_member(id) {    
$('#chatform')[0].reset();
$('.form-group').removeClass('has-error');
$('.help-block').empty();

$.ajax({
    url: "<?php echo site_url('member/ajax_view')?>/" + id,
    type: "GET",
    dataType: "JSON",
    success: function(data) {
        $('[name="UserId"]').val(data.UserId);
        $('#mchat').modal('show');
        $('.modal-title').text(data.UserName);
    },
    error: function(jqXHR, textStatus, errorThrown) {
        alert('Error get data from ajax');
    }
});
$.ajax({
    url: "<?php echo site_url('member/ajax_chats')?>/" + id,
    type: "GET",
    dataType: "JSON",
    success: function(data) {
        var msg1 = data.join('<br />');
        $('#messagesout').html(msg1);

    },
    error: function(jqXHR, textStatus, errorThrown) {

    }

});
$.ajax({
    url: "<?php echo site_url('member/ajax_chats')?>/" + id,
    type: "GET",
    dataType: "JSON",
    success: function(data) {

        var msg2 = data.join('<br />');
        $('#messagesin').html(msg2);


    },
    error: function(jqXHR, textStatus, errorThrown) {

    }

});
}

Answer 1

  public function ajax_chats($id)
    {   

    $user_id = $this->session->userdata('UserId');        
    $list = $this->users->get_msg_byid($id);
    $data = array();
    foreach ($list as $users) 
    {
        $chat_time = $users->SendDate;
        $time = date('H:i', $chat_time);
        $row = array();
       if($users->SenderId==$user_id && $users->RecieverId==$id){
        $row[] = '<div class="darker"><span class="time-left">'.$time.'</span> 
         <span class="text-right"><p>'. $users->Content.'</p></div>';}
        if($users->SenderId==$id && $users->RecieverId==$user_id){
        $row[] = '<div class="lighter"><span class="time-right">'.$time.'</span> 
        <p>'. $users->Content.'</p></div>';
        }
        $data[] = $row;
    }

    $output =  $data;
   echo json_encode($output);

   }