title: Polling Chat message content to screen using ajax JSON
body: <p>Hi I successfully designed a chat message system between users and it works fine. The only problem I am having at this point is polling data from chat table to browser real time.</p>
  
  <p>The messages are displayed using ajax and the setInterval works as I checked the console. The issue is that it does not capture new entries to the table for display and hence the user has to keep refreshing the page to see new content.</p>
  
  <p>Please help. My code is below. Please forgive my file naming convention as I will change it later on.
  PS this is developed using codeigniter framework.</p>
  
  <pre><code>**Chats.php - Controller**
  
      public function ajax_get_chat_messages(){
      echo $this-&gt;_get_chat_messages();
      }
      function _get_chat_messages($recipient = null)
      {
      $user_id = $this-&gt;session-&gt;userdata('user_id');
      $recipient = $this-&gt;input-&gt;post('recipient');
      $data['recipient'] = $this-&gt;User_model-&gt;get_users($user_id);
      $data['chats_count'] = $this-&gt;Chats_model-&gt;get_chat_messages_count($recipient);
      $content = $this-&gt;Chats_model-&gt;get_chat_messages_count($recipient);
      $data['chats'] = $this-&gt;Chats_model-&gt;get_chat_messages($user_id);
      $result = array('status' =&gt;'ok', 'content'=&gt;$content);
      return json_encode($result);
      }
  
  **Model - Chats_model.php**
  
      public function get_chat_messages_count($recipient = null){
      $session = $this-&gt;session-&gt;userdata('user_id');
      $this-&gt;db-&gt;select('*');
      $this-&gt;db-&gt;from('chat_messages');
      $this-&gt;db-&gt;join('users', 'users.user_id = chat_messages.user_id'); 
      $this-&gt;db-&gt;where(array('chat_messages.user_id' =&gt; $session));
      $this-&gt;db-&gt;where(array('chat_messages.recipient' =&gt; $recipient)); 
      $this-&gt;db-&gt;or_where(array('chat_messages.user_id' =&gt; $recipient));
      $this-&gt;db-&gt;where(array('chat_messages.recipient' =&gt; $session));     
      $this-&gt;db-&gt;where_in(array('chat_messages.chat_id' =&gt; $session ,   $recipient));
      $query = $this-&gt;db-&gt;get();  
      return $query-&gt;result_array(); 
      }
  
  **View - chats_view.php**
  
      &lt;script type="text/javascript"&gt;
      var user = "&lt;div class='timeline-item' id='view'&gt;&lt;ul&gt;&lt;?php foreach($chats_count as $chat){echo '&lt;li&gt;'; echo $chat['username']; echo '&lt;/li&gt;'; }?&gt;&lt;/ul&gt;&lt;/div&gt;";
      &lt;/script&gt;
      &lt;div class="wrapper wrapper-content"&gt;
      &lt;div class="row animated fadeInRight"&gt;
      &lt;div class="col-lg-12"&gt;
      &lt;div class="ibox float-e-margins"&gt;
      &lt;div class="ibox-title"&gt;                            
      &lt;h5&gt;Chat&lt;/h5&gt;                       
      &lt;div class="ibox-tools" &gt;                   
      &lt;/div&gt;
      &lt;/div&gt;  
      &lt;div class="ibox-content inspinia-timeline" id="view1" &gt; 
      &lt;/div&gt;   
      &lt;/div&gt;
      &lt;/div&gt;   
      &lt;/div&gt;
      &lt;/div&gt;
      &lt;/div&gt;
      &lt;/div&gt;
      &lt;/div&gt;
  
  **JS - chat2.js**
  
      $(document).ready(function(){
      setInterval(function() { get_chat_messages(); }, 2500)
      $("input#chat_message").keypress(function(e){
      if(e.which == 13){  
      $("a#submit_message").click();
      return false;
      }
      });
  
      function get_chat_messages(){
      $.post(base_url +"user/chats/ajax_get_chat_messages",{user: user}, function(data) {
      if(data)
      {
      var current_content = $("#view1").html();  
      $("#view1").html(user);
      console.log(user);   
      }
      else
      {                             
      }, "json");
      }
  
      get_chat_messages();
      });
  
  
  
  
  
     Images attached showing the table structure, the chat page on browser and console data.
      [Chat page on browser, only showing username for testing purposes][1]
      [Chat Table][2]
      [Console Data, only showing username for testing purposes][3]  
  </code></pre>