dongzha5934 2018-04-13 07:04
浏览 50
已采纳

使用Ajax Codeigniter更新表或div数据

I am trying to create a page where it shows the current chats done by clients. Now I am using Openfire as Server, and PHP Ajax for scripting.

Openfire dumps data into MySQL Table. I retrive all the records using Codeigniter-PHP:

 public function get_chats()
    {
        $this->db->select('*');
        $this->db->from('ofMessageArchive');
        $query = $this->db->get();
        $result = $query->result();


        $this->data['messages'] = $result;


        $this->data['subview'] = 'dashboard/test';
        $this->load->view('_layout_main', $this->data);
    }

Now on my view I have table :

<table class="table table-striped table-bordered table-hover" >
         <thead>
             <th>From</th>
             <th>To</th>
             <th>Message</th>
             <th>Time</th>
         </thead>

         <tbody>
            <?php if(count($messages)): foreach($messages as $key => $message): ?> 
            <tr> 
                <td><?php  $users =  explode("__", $message->fromJID); echo $users[0];?></td>
                <td><?php $tousers =  explode("__", $message->toJID); echo $tousers[0];  ?></td>
                <td><i class="material-icons">play_circle_filled</i>Message</td>
                <td><?php echo $date->format('d-m-y H:i:s'); ?></td>
            </tr>
            <?php endforeach; ?>

            <?php endif; ?>
    </tbody>
    </table>           

Now I don't want to reload the whole page instead just refresh the table contents every 5 seconds.

I am using DataTables.

I also thought I could pass json to my view, but I don't know how to update it every 5 seconds.

public function get_chats()
    {
        $this->db->select('*');
        $this->db->from('ofMessageArchive');
        $query = $this->db->get();
        $result = $query->result();


        if (count($result)) {
            $response =  json_encode($result);
        }
        else
        {
            $response = false;
        }

        echo $response;
    }

Also this is going to send new and older messages. So I only want to append news messages to table old message should be not repeated

  • 写回答

1条回答 默认 最新

  • duandie0884 2018-04-13 07:36
    关注

    Your backend function :

     public function get_chats()
        {
            $this->db->select('*');
            $this->db->from('ofMessageArchive');
            $query = $this->db->get();
            $result = $query->result();
    
    
            if (count($result)>0) {
                $response['status']= true;
                $response['messages']= $result;
                $response['date']= date("d-m-y H:i:s", strtotime($your-date-here));
            }
            else
            {
                $response['status']=false;
            }
    
            echo json_encode($response);
        }
    

    You have to make javascript function like this :

    <script>
    
    function myAJAXfunction(){
     $.ajax({
         url:'your url here',
         type:'GET',
         dataType:'json',
         success:function(response){
             console.log(response);
    
             var trHTML='';
             if(response.status){
               for(var i=0;i<response.messages.length;i++){
    
                  users =response.messages[i]fromJID.slice('--');
                  touser=response.messages[i]toJID.slice('--');
    
                  trHTML=trHTML+
                  '<tr>'+
                   '<td>'+users[0]+'</td>'+
                   '<td>'+touser[0]+'</td>'+
                   '<td><i class="material-icons">play_circle_filled</i>Message</td>'+
                   '<td>'+response.date+'</td>'+
                   </tr>';
             }
    
               $('tbody').empty();
               $('tbody').append(trHTML);
    
             }else{
               trHTML='<tr><td colspan="4">NO DATA AVAILABLE</td></tr>';
               $('tbody').empty();
               $('tbody').append(trHTML);
             }
    
         },
         error:function(err){
            alert("ERROR LOADING DATA");
         }
     });
    }
    
    
    // calling above ajax function  at every 5 seconds
    
    setInterval(myAJAXfunction,5000);
    
    </script>
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论

报告相同问题?

悬赏问题

  • ¥15 NeRF的代码复现以及人工智能入门
  • ¥15 centos如何做一个可以让ikuai连接的openvpn
  • ¥15 Protege 中的Entities下面的界面删除了如何复原
  • ¥15 scrapy爬虫求帮
  • ¥15 imageEnView绘图问题
  • ¥15 关于#python#的问题:您好可以加您一下联系方式吗,在复现的时候确实有点问题难以解决
  • ¥15 联想电脑重装系统时无法发现硬盘
  • ¥15 MATLAB与UR10e实体机械臂建立通讯
  • ¥15 c++题需要快一点不用opencv
  • ¥15 关于#java#的问题:想要咨询Flowable流程引擎框架的问题