TableTools not loading on a DataTables Table

Question

The datatables works fine however I am trying to add TableTools and I am having issues. With what I am using the data tables works fine as intended with no issues at all, however trying to add tabletools to it has had no success. There are no console errors reported with what I am doing yet nothing displays. This leads me to believe I am doing something wrong in the code. I have put the code below.

The script includes:

        <script src="//cdn.datatables.net/1.9.4/js/jquery.dataTables.js"></script>
        <script src="//cdn.datatables.net/tabletools/2.2.0/js/dataTables.tableTools.js"></script>
        <script src="//tinymce.cachefly.net/4.0/tinymce.min.js"></script>
        <link rel="stylesheet" href="//cdn.datatables.net/tabletools/2.2.0/css/dataTables.tableTools.css" type="text/css" media="all" />

I am using the following code:

        var foreTable = $(".cscf-fore-table").dataTable({dom: \'T<"clear">lfrtip\',
            tableTools: {
                "sSwfPath": "//cdn.datatables.net/tabletools/2.2.0/swf/copy_csv_xls.swf",
                "aButtons": [
                "copy",
                "csv",
                "xls",
                "print"
                ]
            },
                "bSort": false,"aLengthMenu": [
                [25, 50, 100, 200, -1],
                [25, 50, 100, 200, "All"]
                ],
            "iDisplayLength":-1, "bJQueryUI":true, "sPaginationType":"full_numbers"});

you need to include the CSS also, **//cdn.datatables.net/tabletools/2.2.2/css/dataTables.tableTools.css** — davidkonrad, Aug 14 '14 at 11:41
@davidkonrad ...yeah...if you look at the code I have in the post there is an include that is exactly that URL.... — ComputerLocus, Aug 14 '14 at 14:04
Ups, how could I overlook that? that :( The reason was I tried your code out -> **http://jsfiddle.net/v5c9v8jf/** and it seems to work without problems. At first I considered `"sSwfPath": "//cdn..` -> `"sSwfPath": "http://cdn..` but either way works. Can you post a fiddle reproducing the problem, or link to the site? — davidkonrad, Aug 14 '14 at 14:13
@davidkonrad you are using 1.10. I am using 1.9.4. I have errors with my existing code upgrading it. Here is the fiddle with older version. It doesn't work: http://jsfiddle.net/v5c9v8jf/1/ — ComputerLocus, Aug 14 '14 at 14:18

davidkonrad · Accepted Answer · 2014-08-14T22:01:41.810

First, the fiddle you forked does not work because you import tabletools.js / .css before dataTables.js and .css.

The main reason for tableTools not working for you is a mix between the 1.10.x camelcase naming convention and the 1.9.x hungarian notation. You have probably done some kind of upgrading / copypaste from examples? You have :

dataTable({
   dom: 'T<"clear">lfrtip',

But dom was named sDom prior to 1.10.x. In 1.10.x you can use both dom and sDom, but dataTables 1.9.4 does only know sDom. Simply change to

dataTable({
   sDom: 'T<"clear">lfrtip',

Thats why there were no errors in the console. TableTools was never initialized, your entire dom-declaration was ignored.

See the fiddle forked again, now working - dataTables 1.9.4 and tableTools 2.2.2 -> http://jsfiddle.net/7ng9wfak/

TableTools not loading on a DataTables Table

1 Answers1