Добавление элементов управления звуком и кнопки в обработку на стороне сервера Datatables

Я использую Datatables с Codeigniter - PHP.

Теперь в таблице у меня очень большие данные, поэтому я использовал обработку на стороне сервера Datatables для отображения своих данных.

В моем столе есть аудиофайл, который можно воспроизвести, и кнопка для загрузки файла.

Ранее, когда я не использовал обработку на стороне сервера, я использовал ее для отображения следующим образом:

<table id = "dtMaterialDesignExample" class = "table table-striped table-bordered example hoverable"  style = "width:100%">
    <thead>
        <tr>
            <th><i class = "fas fa-user"></i> Caller </th>
            <th><i class = "fas fa-calendar-week"></i> Date</th>
            <th><i class = "fas fa-clock"></i> Duration</th>

            <th><i class = "fas fa-sort-numeric-down"></i> Recipient Number</th>
            <th><i class = "fas fa-play"></i> Recording</th>
            <th><i class = "fas fa-download"></i> Download</th>
        </tr>
    </thead>
    <tbody>
       <?php if (count($reports)): foreach($reports as $report): ?>   
        <tr >
            <td><?php echo $report->src; ?></td>
            <td><?php echo $report->calldate; ?></td>
            <td><?php echo $report->duration; ?> Seconds</td>

            <td><?php echo $report->dst; ?></td>
            <td> 
              <audio controls controlsList = "nodownload">
                  <source src = "<?php echo ccs_recording_path.$report->filename.'-all.mp3'; ?>" type = "audio/ogg" data-recordings = "<?php echo $report->filename.'-all.mp3'; ?>">
              </audio>
            </td>
            <td style = "text-align: center;"><a href = "<?php echo ccs_recording_path.$report->filename.'-all.mp3'; ?>"><i class = "fas fa-2x fa-file-download"></i></a> </td>

        </tr>

        <?php endforeach; ?>
          <?php else: ?>
          <tr>
              <td colspan = "10">No Records Available</td>
          </tr>
          <?php endif; ?> 
    </tbody>

</table>

Теперь, когда я добавил серверную часть, мой код:

HTML

<table id = "dtMaterialDesignExample" class = "table table-striped table-bordered example hoverable"  style = "width:100%">
<thead>
    <tr>
        <th><i class = "fas fa-user"></i> Caller </th>
        <th><i class = "fas fa-calendar-week"></i> Date</th>
        <th><i class = "fas fa-clock"></i> Duration</th>

        <th><i class = "fas fa-sort-numeric-down"></i> Recipient Number</th>
        <th><i class = "fas fa-play"></i> Recording</th>
        <th><i class = "fas fa-download"></i> Download</th>
    </tr>
</thead>

</table>

PHP

public function response()
{
    $from_date = "2019-01-01 00:00:00";
    $to_date   = "2019-01-23 00:00:00"; 

    $response = $this->Report_m->get_agent_cdr($from_date,$to_date);

    $response = ["sEcho" => 1,
        "iTotalRecords" => count($response),
        "iTotalDisplayRecords" => count($response),
        "aaData" => $response ];


    $response = json_encode($response);

    echo $response;

}

ЯВАСКРИПТ

$(document).ready(function () {
var table = $('#dtMaterialDesignExample').DataTable({
"lengthMenu": [[5,10, 25, 50, -1], [5,10, 25, 50, "All"]],
"sAjaxSource": "<?php echo site_url('CDR/response'); ?>",
"bProcessing": true,
"aoColumns": [
        { mData: 'src' } ,
        { mData: 'calldate' },
        { mData: 'duration'},
        { mData: 'dst'},
        { mData: '<audio controls controlsList = "nodownload"><source src = "<?php echo ccs_recording_path.$report->filename.'-all.mp3'; ?>" type = "audio/ogg" data-recordings = "<?php echo $report->filename.'-all.mp3'; ?>"></audio>'},
        { mData: '<a href = "<?php echo ccs_recording_path.$report->filename.'-all.mp3'; ?>"><i class = "fas fa-2x fa-file-download"></i></a>'},
      ],
  dom: '<"float-left"B><"float-right"f>rt<"row"<"col-sm-4"l><"col-sm-4"i><"col-sm-4"p>>',
  fixedHeader: true,
    buttons: [
        {
            extend: 'csvHtml5',
            title: 'bizRTC CDR <?php date('d-m-Y'); ?>',
             customize: function (csv) {
                 return "Enjoy the file"+csv;
              },
               className: 'btn btn-outline-primary waves-effect space',
        },
        {
        extend: 'pdfHtml5',
        title: 'CDR <?php echo date('d-m-Y'); ?>',
        customize: function ( doc ) {
                        doc.content.splice( 0, 0, {
                            text: "bizRTC CDR"
                        } );
        },
        className: 'btn btn-outline-primary waves-effect space',
        },
        {
            extend: 'excelHtml5',

            title: 'bizRTC CDR <?php date('d-m-Y'); ?>',
            message: "Call Records",
            className: 'btn btn-outline-primary waves-effect space',


        },
    ],

  responsive: {
        details: {
            display: $.fn.dataTable.Responsive.display.modal( {
                header: function ( row ) {
                    var data = row.data();
                    return 'Details for '+data[0]+' '+data[1];
                }
            } ),
            renderer: $.fn.dataTable.Responsive.renderer.tableAll( {
                tableClass: 'table'
            } )
        }
    },
    "drawCallback": function () {
        $('.dataTables_paginate > .pagination').addClass('pagination pagination-circle pg-blue mb-0');
    }
});

Для последних двух столбцов у меня есть аудиоплеер и кнопка «Как мне показать их в таблицах данных?»