Adding Export Buttons Removed My Pagination Menu

Ninja Joe

I used the following code to create my DataTable:

$( '#builders-datatable' ).DataTable( { scrollX: true, pageLength: 50, pagingType: 'full_numbers',
    drawCallback: function() {
        $( '.dataTables_paginate > .pagination' ).addClass( 'pagination-rounded' );
    }
} );

However, when I added export buttons with:

dom: 'Bfrtip', buttons: buttonSettings,

My pagination menu went away!

$( '#builders-datatable' ).DataTable( { scrollX: true, pageLength: 50, pagingType: 'full_numbers', dom: 'Bfrtip', buttons: buttonSettings,
    drawCallback: function() {
        $( '.dataTables_paginate > .pagination' ).addClass( 'pagination-rounded' );
    }
} );

How can I show both the export buttons AND the pagination menu?

kthorngren

Please see this FAQ.

Kevin

Ninja Joe

This worked a charm, thank you. I personally feel button examples should include the "l" to prevent this from happening, though. For reference, I ended up going with:

dom: 'lBfrtip',

allan

You can add the pageLength into the buttons array to display a page length list of options, as mentioned in the FAQ - that is usually the easiest way. The list of buttons is entirely customisable, which is why it isn't in there by default.

Allan