Cannot add export button besides editor buttons

natrabis

When using Datatables Editor plugin, I am trying to add the Export (excel, csv, etc) button besides the "New", "Edit" and "Delete" buttons. My original code:

new $.fn.dataTable.Buttons( table, [
        { extend: "create", editor: editor },
        { extend: "edit",   editor: editor },
        { extend: "remove", editor: editor }
    ]);
    table.buttons().container()
        .appendTo( $('.col-md-6:eq(0)', table.table().container() ) );
} );

I have tried to add the export button following a few examples, one of the latest being:

new $.fn.dataTable.Buttons( table, [
        { extend: "create", editor: editor },
        { extend: "edit",   editor: editor },
        { extend: "remove", editor: editor },
        {
    buttons: [
        'copy', 'excel', 'pdf'
    ]}
    
    ] );
   
 

    table.buttons().container()
        .appendTo( $('.col-md-6:eq(0)', table.table().container() ) );
} );

I have the following scripts included, which allow the export button:

     <script type="text/javascript" charset="utf-8" src="https://cdn.datatables.net/buttons/1.6.4/js/dataTables.buttons.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
    <script type="text/javascript" charset="utf-8" src="https://cdn.datatables.net/buttons/1.6.4/js/buttons.html5.min.js"></script>

What am I doing wrong??

rf1234

You are using two different ways to add the buttons. the first one is to add buttons after dt initialization, the second one would work when used inside a dt definition but not like this

So this should work:

new $.fn.dataTable.Buttons( table, [
        { extend: "create", editor: editor },
        { extend: "edit",   editor: editor },
        { extend: "remove", editor: editor },
        'copy', 'excel', 'pdf'
    ] );

or this as part of the dt definition executed at dt initialization:

buttons: [
        { extend: "create", editor: editor },
        { extend: "edit",   editor: editor },
        { extend: "remove", editor: editor },
        'copy', 'excel', 'pdf'
    ]

natrabis

all good- thanks