view

    table id="depomas" cellpadding="0" cellspacing="0" border="0" class="display" width="100%">
          <thead>
          <tr>
            <th width="9%"><div align="center">Tanggal</div></th>
            <th width="9%"><div align="center">Kode Deposit</div></th>
            <th width="20%"><div align="center">Maskapai</div></th>
            <th width="14%"><div align="center">Nilai</div></th>
            <th width="18%"><div align="center">Account</div></th>
            <th width="21%"><div align="center">Keterangan</div></th>
            <th width="9%"><div align="center">Action</div></th>
          </tr>
          </thead>
          <tbody>
          </tbody>
        </table>

java -----------
/* ========================================================================= */
/*  Datetable Deposit Maskapai
/* ========================================================================= */

$('#depomas').DataTable( {
          "order": [[ 0, "desc" ]],
          "bProcessing": true,
          "bServerSide": true,
          "bJQueryUI": false,
          "responsive": true,
          "oLanguage": {
          "sProcessing": "<img src='dist/img/loading2.gif'>"},
          "sAjaxSource": "module/mod_deposit_maskapai/serverside.php", // Load Data
          "sServerMethod": "POST",
          "columnDefs": [
          { "orderable": true, "targets": 0, "searchable": true },
          { "orderable": true, "targets": 1, "searchable": true },
          { "orderable": true, "targets": 2, "searchable": true },
          { "orderable": true, "targets": 3, "searchable": true },
          { "orderable": true, "targets": 4, "searchable": true },
          { "orderable": true, "targets": 5, "searchable": true },
          { "orderable": false, "targets": 6, "searchable": false },
          ]
});
$('#depomas').removeClass( 'display' ).addClass('table table-striped table-bordered table-hover');