Can't get DataTables TableTools to display

Question

Dunno what I'm doing wrong here. I have DataTables in the directory:

MainFolder/common/js/DataTable-1.8.2/jquery.dataTables.min.js

and am including it like so:

<script src="common/js/DataTable-1.8.2/jquery.dataTables.min.js"></script>

I've downloaded the latest version of TableTools and have tried putting it in various places inside the DataTable-1.8.2 directory:

MainFolder/common/js/DataTable-1.8.2/TableTools-2.0.1

MainFolder/common/js/DataTable-1.8.2/Extras/TableTools-2.0.1

MainFolder/common/js/DataTable-1.8.2/media/(all files included in media/)

I'm initializing my tables like so (after Ajax calls):

$('#grid-container').dataTable({
'aaData': response.AADATA,
"aoColumns": aoColumns,
"bJQueryUI": true,
"bDestroy": true,
"iDisplayLength": 20,
"sDom": '<"H"lTfr>t<"F"ip>'
});

I have also tried setting the sSwfPath parameter using

"oTableTools": {
    "sSwfPath": "Extras/TableTools-2.0.1/media/swf/copy_cvs_xls_pdf.swf" //and many other permutations, including relative to the Main Folder root
}

I have also tried disabling the bjQueryUI parameter and using the regular sDom default settings, as well as placing the "T" marker in different places in the sDom string.

I simply can't get TableTools to display in any browser. Flash Player 11.1.102.55 is installed. Console shows no errors.

score 1 · Answer 1 · answered May 13 '14 at 14:02

Since I use several css styles and several datatables versions (blitzer is one of them) I paste this code into my page. It will use datatables css and sort and use the copy, .csv, .pdf functions. Some typical H2 and font setting are included. Just a good place to start.

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">    
<script type='text/javascript' src='../jquery-ui-1.8.21/js/jquery-1.7.2.min.js'></script>
<script type='text/javascript' src='../jquery-ui-1.8.21/js/jquery-ui-1.8.21.custom.min.js'>     </script>
<script type='text/javascript' src=../jquery-ui-1.9.2/js/jquery-ui-1.9.2.custom.js'></script>
<script type='text/javascript' src='../DataTables-1.9.4/media/js/jquery.dataTables.js'></script>
<script type='text/javascript' src='../TableTools/js/dataTables.tableTools.js'></script>
<script type='text/javascript' src='../TableTools/js/dataTables.tableTools.min.js'></script>
<style type="text/css">
        @import "../DataTables-1.9.4/media/css/demo_table_jui.css";
        @import "../jquery-ui-1.10.3.custom/css/blitzer/jquery-ui-1.10.3.custom.css";
        @import "../TableTools/css/dataTables.tableTools.css";
  H2 {page-break-before: always}
  .display {font:arial;}
  </style>
  <script type="text/javascript" charset="utf-8">
        $(document).ready(function(){
            $('#datatables').dataTable({
            "bPaginate": false,
            "bLengthChange": false,
            "bFilter": true,
            "bInfo": false,
            "bAutoWidth": false,
            "bSort": true,
            "sDom": 'RCT<"clear">lfrtip',
            "tableTools": {
                "sSwfPath": "../TableTools/swf/copy_csv_xls_pdf.swf",
                "aButtons": [ "copy", "csv", "pdf"  ]
            }

        });
    });

  </script>

score 1 · Answer 2 · edited Aug 10 '12 at 20:37

1

I haven't actually worked with TableTools, but I did activate it once (just to see what it is)

I am not sure that this is the reason, but have you tried setting the sDom as it says in the example to:

"sDom": 'T<"clear">lfrtip'

Because the one you posted is different.

edited Aug 10 '12 at 20:37

Jeff Noel

7,500
4
40
66

answered Nov 29 '11 at 11:29

Daniel

36,833
10
119
200

score 1 · Answer 3 · edited Jan 02 '12 at 22:25

1

Make sure you are including the TableTools.js, ZeroClipboard.js and TableTools.css. Putting the DataTables directory doesn't make it found automatically.

edited Jan 02 '12 at 22:25

Zsolt Botykai

50,406
14
85
110

answered Jan 02 '12 at 21:13

idarke

39
2

score 0 · Answer 4 · edited Jul 29 '13 at 13:38

0

This will work if you use JQueryUI already

$(document).ready(function() {
    $('#example').dataTable( {
    "bJQueryUI": true,
        "sPaginationType": "full_numbers"  ,
        "bLengthChange" : true,
        "iDisplayLength" : 25,
    "sDom": '<"H"Tfr>t<"F"ip>',
        "oTableTools": {
            "aButtons": [
                "copy","xls", "pdf"]
        }        
    } );

edited Jul 29 '13 at 13:38

Bridge

29,818
9
60
82

answered Jul 29 '13 at 13:18

Frederic LE MAISTRE

1

It does not work to use jqueryui with the parameters you wrote. Can you help?http://konzertagentur-koerner.de/index.php/Homepage/getSolist I included the three files zeroclipboard.js, tabletools.js and tabletools.css Neither does it work with the "standard" oTableTools suggested by Allan on his website without the jqueryui – Timo Jan 09 '14 at 09:46
I just found out that my website (see link above) works with tabletools on chrome, but not on firefox. Solution is described here http://datatables.net/forums/discussion/comment/35801 – Timo Jan 10 '14 at 08:31

Can't get DataTables TableTools to display

4 Answers4