title: Codeigniter - How to fetch datatable data from ajax?
body: <p>I'm working an application based on CodeIgniter. Here the code:</p>
  
  <p><strong>Controller</strong>:</p>
  
  <pre><code>public function index(){
      $data = array(
              'record' =&gt; $this-&gt;Parameter_model-&gt;get_parameter('tbl_parameter')
          );
      $this-&gt;site-&gt;view('parameter', $data);
  }
  </code></pre>
  
  <p><strong>Model</strong>:</p>
  
  <pre><code>public function get_parameter($table){
      $query = $this-&gt;db-&gt;query("select * from $table order by 'parameter_ID' ASC");
      if($query-&gt;num_rows() &gt; 0){
          foreach($query-&gt;result_array() as $row){
              $data[] = $row;
          }
  
          $query-&gt;free_result();
      }
  
      else{
          $data = NULL;
      }
  
      return $data;
  }
  </code></pre>
  
  <p><strong>View</strong>:</p>
  
  <pre><code>&lt;table id="parameter" class="listdata table table-bordered table-striped table-hover"&gt;
    &lt;thead&gt;
      &lt;tr&gt;
        &lt;th class="text-nowrap"&gt;Parameter&lt;/th&gt;
        &lt;th class="text-nowrap"&gt;Method&lt;/th&gt;
        &lt;th class="text-nowrap"&gt;Type&lt;/th&gt;
        &lt;th class="text-nowrap"&gt;Action&lt;/th&gt;
      &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody&gt;
      &lt;?php if(!empty($record)):?&gt;
        &lt;?php foreach($record as $row):?&gt;
          &lt;tr align="center"&gt;
            &lt;td class="text-nowrap"&gt;&lt;a href="&lt;?=set_url('parameter/parameter_view/'.$row['parameter_ID']);?&gt;"&gt;&lt;strong&gt;&lt;?php echo $row['parameter_name'];?&gt;&lt;/strong&gt;&lt;/a&gt;&lt;/td&gt;
            &lt;td class="text-nowrap"&gt;&lt;?php echo $row['parameter_method'];?&gt;&lt;/td&gt;
            &lt;td class="text-nowrap"&gt;
              &lt;?php 
                if($row['parameter_type'] == "1"){
                  echo "General";
                }
                else{
                  echo "COA Only";
                }
              ?&gt;
            &lt;/td&gt;
            &lt;td class="text-nowrap"&gt;
              &lt;div&gt;
                &lt;a href="&lt;?=set_url('parameter#edit?parameter_ID='.$row['parameter_ID']);?&gt;" class="btn btn-warning btn-xs"&gt;Edit&lt;/a&gt;
                &lt;a href="&lt;?=set_url('parameter/parameter_view/'.$row['parameter_ID']);?&gt;" class="btn btn-success btn-xs"&gt;Lihat&lt;/a&gt;
                &lt;a href="&lt;?=set_url('parameter#hapus?parameter_ID='.$row['parameter_ID']);?&gt;" class="btn btn-danger btn-xs"&gt;Hapus&lt;/a&gt;
              &lt;/div&gt;
            &lt;/td&gt;
          &lt;/tr&gt;
        &lt;?php endforeach;?&gt;
      &lt;?php endif;?&gt;
    &lt;/tbody&gt;
    &lt;tfoot&gt;
      &lt;tr&gt;
        &lt;th class="text-nowrap"&gt;Parameter&lt;/th&gt;
        &lt;th class="text-nowrap"&gt;Method&lt;/th&gt;
        &lt;th class="text-nowrap"&gt;Type&lt;/th&gt;
        &lt;th class="text-nowrap"&gt;Action&lt;/th&gt;
      &lt;/tr&gt;
    &lt;/tfoot&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p><strong>Javascript</strong>:</p>
  
  <pre><code>// parameter
  // Setup - add a text input to each footer cell
  $('#parameter tfoot th').each( function () {
      var title = $(this).text();
      $(this).html( '&lt;input type="text" style="width:100%;" title="Search '+title+'" placeholder="Search '+title+'" /&gt;' );
  } );
  
  // DataTable
  var table = $('#parameter').DataTable({
      paging: true,
      searching: true,
      ordering: true,
      "order": [[ 0, "asc" ]],
      scrollX: true,
      scroller: true,
  });
  
  // Apply the search
  table.columns().every( function () {
      var that = this;
  
      $( 'input', this.footer() ).on( 'keyup change', function () {
          if ( that.search() !== this.value ) {
              that
                  .search( this.value )
                  .draw();
          }
      } );
  } );
  </code></pre>
  
  <p>Above code work well.</p>
  
  <p>Now, I want to fetch data into the <code>table id="parameter"</code> via ajax request. I've create an ajax request from url, lets say from here <code>http://'+host+path+'/action/ambil</code>, where <code>var path = window.location.pathname;</code> and <code>var host = window.location.hostname;</code>.</p>
  
  <p>The ajax response produce:</p>
  
  <pre><code>{"record":[{"parameter_ID":"1","parameter_name":"pH","parameter_method":"(pH meter)","parameter_type":"1",{"parameter_ID":"2","parameter_name":"Viscosity","parameter_method":"(Brookfield-Viscometer)","parameter_type":"1"}]}
  </code></pre>
  
  <p><strong>Question</strong><br>
  How to configure datatable with Ajax data source, and how to display the data into the table, so I can use the data for example to create a link like code<br>
  <code>&lt;a href="&lt;?=set_url('parameter/parameter_view/'.$row['parameter_ID']);?&gt;"&gt;</code></p>