Replacing TableTools with Buttons and Select extensions

jLinux

Im updating my DataTables cross my app from 1.10.7 to 1.10.8, and I notice that TableTools is now retired.
(Isn't the #.#.X octet for bug fixes only? Maybe I'm wrong)

I looked at the documentation, and i see how to make the export buttons, but I had some heavy customization around them, seen below..

// The export buttons in the tool box
var tableTools1 = new $.fn.dataTable.TableTools( table, {
    sSwfPath: "/include/plugins/DataTables-1.10.7/extensions/TableTools/swf/copy_csv_xls_pdf.swf",
    sRowSelect: "multi",
    aButtons: [
        {
            sExtends:    "copy",
            bSelectedOnly: true,
            sButtonText: 'Copy',
            fnInit: function ( nButton, oConfig ) {
                $(nButton).addClass('btn btn-xs btn-primary p-5 export-copy');
            }
        },
        {
            sExtends:    "csv",
            bSelectedOnly: true,
            sButtonText: 'CSV',
            fnInit: function ( nButton, oConfig ) {
                $(nButton).addClass('btn btn-xs btn-primary p-5 export-csv');
            },
            fnClick: function ( nButton, oConfig, oFlash ) {
                log_export_action('csv');
            }
        },
        {
            sExtends:    "pdf",
            bSelectedOnly: false,
            sButtonText: 'PDF',
            fnInit: function ( nButton, oConfig ) {
                $(nButton).addClass('btn btn-xs btn-primary p-5 export-pdf');
            },
            fnClick: function ( nButton, oConfig, oFlash ) {
                log_export_action('pdf');
            }
        },
        {
            sExtends:    "print",
            sButtonText: 'Print',
            fnInit: function ( nButton, oConfig ) {
                $(nButton).addClass('btn btn-xs btn-primary p-5 export-print');
            },
            fnClick: function ( nButton, oConfig, oFlash ) {
                log_export_action('print');
            }
        }
    ]
} );

// The select all and deselect all buttons in the tools sidebar
var tableTools2 = new $.fn.dataTable.TableTools( table, {
    sSwfPath: "/include/plugins/DataTables-1.10.7/extensions/TableTools/swf/copy_csv_xls_pdf.swf",
    sRowSelect: "multi",
    aButtons: [
        {
            sExtends:    "select_all",
            sButtonText: 'Select All',
            fnInit: function ( nButton, oConfig ) {
                $(nButton).addClass('btn btn-xs btn-primary p-6 m-b-5 p-l-8');
            }
        },
        {
            sExtends:    "select_none",
            sButtonText: 'Deselect All',
            fnInit: function ( nButton, oConfig ) {
                $(nButton).addClass('btn btn-xs btn-primary p-6 m-b-5');
            }
        }
    ]
} );

// Add the buttons to the sidebar
$( tableTools1.fnContainer() ).insertAfter('div#export-assets');
$( tableTools2.fnContainer() ).insertAfter('span#select-assets');

This was used to put the buttons in two different DIV's, (One for exporting, the other for selecting).

Is there a way to keep this functionality with the Buttons and Select extensions?

allan

I notice that TableTools is now retired. (Isn't the #.#.X octet for bug fixes only? Maybe I'm wrong)

That is correct. Strictly by semver this should have been a minor bump of DataTables, but they are only very minor features I've added, so its a minor release.

TableTools is separate software from DataTables, so it has no effect on the DataTables version number.

What you have all looks like it should be workable with Buttons. You would probably use buttons.buttons.className to set the class name, although there is a buttons.buttons.init if you want to do it directly.

Allan

jLinux

Do I have to do anything to specify the swf path for exports?

Im trying to create the buttons inside a div that I can place anywhere on the page, so how can I do that? the two option links you sent me will add classes, I need to create a div or span with the buttons then do something like..

$( tableTools2.fnContainer() ).insertAfter('span#select-assets');

EDIT: I think I can use the example here to do it: http://datatables.net/extensions/buttons/examples/initialisation/multiple.html

Ill give it a go

jLinux

I do get an error when trying to use the Excel export..

http://d.pr/i/148vK

allan

Could you include that one in the test case to PM to me as well please? I've not seen that one before.

Thanks,
Allan

jLinux

Come to think of it allan.... yhe excel export didnt work when i had tabletools either. The csv/print/copy/pdf all worked, but xls didnt, it never showed an error tho in the console.

Now, same thing, except it shows that error

jLinux

One more thing. For the export buttons, how can I have it export only the columns that are being shown? Im using the column visibility too, with the old TableTools, I could have it export only the visible columns

gauravmak

I am also facing the same problem, Allan.
I have opened a thread for that here - http://datatables.net/forums/discussion/29499/facing-a-couple-of-problems-which-are-specific-to-my-implementation-can-t-reproduce#latest

Waiting for the update.

allan

@jhyland87 - The export issue with Excel is a bug in 1.0.0 I'm afraid. I'm going to release 1.0.1 on Friday with the fix.

For the export buttons, how can I have it export only the columns that are being shown?

Use the exportOptions option of the export buttons (excelHtml5 for example). That provides an option (thought the buttons.exportData() method) to select which columns to export.

I've added a new example that shows how it can be done.

@gauravmak - I've replied in your thread.

Allan