title: How do I display data back from a javascript calling a php function?
body: <p>I'm using a MVC framework and in my view I have my javascript code</p>
  
  <p>this is in my view:</p>
  
  <pre><code>&lt;script&gt;
  $(document).ready(function(){
      $(document).on('click','#filtr',function(){
          var id_val = $('#id_val').val();
          var key_val= $('#key_val').val();
          console.log(id_val);
          console.log(key_val);
          $.ajax({
              url:"&lt;?php echo base_url()?&gt;filter/filtr",
              method:"POST",
              data:{
                  id_val:id_val,
                  key_val:key_val
              },
              /*beforeSend:function(){
                  $("container_tab").html("Searching...");
              },*/
              success:function(data){
                  $("container_tab").html(data);
              }
          })
      });
  });
  &lt;/script&gt; 
  &lt;div class="table-responsive"&gt;
  &lt;table class="table table-striped table-hover" id="dataTables-example"&gt;
  &lt;tr&gt;
      &lt;td&gt;
          Filter by...
      &lt;/td&gt;
      &lt;td&gt;
          ID: &lt;input type="text" id="id_val" name="id_val" value="3" /&gt;
      &lt;/td&gt;
      &lt;td&gt;
          KEY: &lt;input type="text" id="key_val" name="key_val" value="asdf12" /&gt;
      &lt;/td&gt;
      &lt;td&gt;
          &lt;button type="button" class="btn btn-info btn-sm" id="filtr"&gt;FILTER&lt;/button&gt;
      &lt;/td&gt;
  &lt;/tr&gt;
  
  &lt;br /&gt;
  &lt;div id="container_tab"&gt;&lt;/div&gt;
  &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I want the table that comes back from my controller to fill <code>&lt;div id="container_tab"&gt;&lt;/div&gt;</code></p>
  
  <p>in my filter controller I have my filtr function, but this function for now does not return $filter_list even though I'm still not doing the actual query.</p>
  
  <pre><code>public function filtr(){
      $filter_list = '';
      $filter_list .= '
                      &lt;tr&gt;
                              &lt;td style="vertical-align: middle;" class="text-center"&gt;this should be sent to view as a table row&lt;/td&gt;
                      &lt;/tr&gt;
              ';
  
      echo $filter_list;
  
  }
  </code></pre>
  
  <p>when I do a console.log within my javascript function the values '3' and 'asdf12' are display but I'm not getting anything back on screen from my controller function calling filtr.</p>