如何告诉DataTables导出按钮的插入位置

Question

I wanna archive something like this with datatables

But I can't find a way how to tell datatable where to insert button copy, excel,PDF etc. Default insert button datatable will replace sorting entries like this

This is my code

<div class="box-header">
    <div class="buttonContainer"></div>
    <div class="pull-right">
       <button class="btn btn-primary form-button" id="addNew">Tambah Produk</button>
    </div> 
</div>

and

var dTable;
    dTable = $('#dataTable').DataTable({
      "bProcessing": true,
      "bAutoWidth": false,
      "responsive": true,
      "buttons": [ 'copy', 'excel','csv','pdf'],
    });

I wanna insert datatable buttons in buttonContainer

I found a reference how to do that in here dom datatable

but not quite understand how to implement it in my case

Please help

Answer 1

SOLUTION

Use dom option with the value Bfrtip .

var dTable = $('#dataTable').DataTable({
   "dom": "Bfrtip"
   "bProcessing": true,
   "bAutoWidth": false,
   "responsive": true,
   "buttons": [ 'copy', 'excel','csv','pdf']
});

DEMO

See this jsFiddle for code and demonstration.