Fill table with Ajax

I am presented with the following problem.

I have a table in a View called all_calls_view.php which is called by the following controller reg_calls_controller.php and the function all_calls_view . As you can see when you send the call the view also passes a parameter with data ($ data).

  

Controller reg_calls_controller = > Function

public function todas_calls() {

  $sess_array = array(
    'id_user' => $this->session->userdata['sess_data']['id_user'],
    'username' => $this->session->userdata['sess_data']['username']
  );

  $data = array();
  $data['sess_data'] = $sess_array;

  $date_inicio = "2018-01-01 00:00:00";
  $date_fin = "2018-01-31 23:59:59";

  $data['todas_calls']  = $this->reg_calls_model->todas_calls($date_inicio, $date_fin);

  $data['menu_higher'] = $this->load->view('elementos/menu_higher_view.php', $data, TRUE);
  $data['menu_left'] = $this->load->view('elementos/menu_left_view.php', '', TRUE);

  $this->load->view("todas_calls_view.php", $data);

}

Then I'm trying to do is that in that view I have two inputs where I capture two dates, then a button calls a JavaScript function and this java script calls the same controller above but another function called filter_calls and I already get the data in the success, but now what I want to do is pass them to the table.

  

JavaScript

function accion_botones(accion) {
            var url;
            if (accion = 1) {
                url = "<?php echo base_url('index.php/reg_calls_controller/filtrar_calls')?>";
            } else if (accion = 2) {
                url = "<?php echo base_url('index.php/reg_calls_controller/export_pdf_calls')?>";
            } else {
                url = "<?php echo base_url('index.php/reg_calls_controller/export_excel_calls')?>";
            }

            var date_inicio = document.getElementById('date_inicio').value;
            var date_fin = document.getElementById('date_fin').value; 

            $.ajax({
            url : url,
            type: "POST",
            data: {'date_inicio':date_inicio, 'date_fin':date_fin},
            dataType: "JSON",
            success: function(data) {
                alert('muy bien!');
                console.log(data);
            },
            error: function (jqXHR, textStatus, errorThrown) {
                alert('Error...');
            }
        }); 
        }

  

Table that I want to fill with the data I have in the succes dej JS

<table id="example" class="display" style="width:100%">
  <thead>
    <tr>
      <th>#</th>
      <th>Origen</th>
      <th>Nombre</th>
      <th>Grupo</th>
      <th>Destino</th>
      <th>Seg.</th>
      <th>Min.</th>
      <th>Fecha</th>
    </tr>
  </thead>
  <tbody>
    <?php if($todas_calls != NULL) : ?>  
            <?php foreach($todas_calls as $row) : ?>
        <tr>
            <td><?php echo $row->calldate;?></td>
            <td><?php echo $row->clid;?></td>
            <td><?php echo $row->src;?></td>
            <td><?php echo $row->dst;?></td>
            <td><?php echo $row->dcontext;?></td>
            <td><?php echo $row->channel;?></td>
            <td><?php echo $row->dstchannel;?></td>
            <td><?php echo $row->lastapp;?></td>
        </tr>
            <?php endforeach; ?>
        <?php endif; ?>
  </tbody>
</table>