Datatables TableTools: Configuration Issues

I've been using dataTables in my project for a while now and would like to improve the user experience by adding some of the nice features that TableTools offers. I started playing with it and I am struggling to get the main example to work, so there is definitely something wrong in my config, so I hope someone here can point out the obvious, because in my head it should work just fine, but it isn't.

I currently have jQuery and dataTables libraries (1.9.4) stored in the same directory in my project. They are currently functioning perfectly.

  • src = "scripts / jQuery / jQuery-1.8.2.min.js"
  • src = "scripts / jQuery / jquery.dataTables.min.js"

I downloaded tableTools js and saved it in the same scripts / jquery directory and also saved the css file in my css directory.

  • src = "scripts / jQuery / dataTables.tableTools.js"
  • href = "style / dataTables.tableTools.css" / ">

I am trying to recreate the below example here . I added a sample HTML table and JavaScript code to the jsp file.

$(document).ready(function() { 

$('#example').DataTable(
     { "dom": 'T<"clear">lfrtip', 

                "tableTools": { 
                     "aButtons": [ "copy", "print", 
                    { "sExtends": "collection", 
                      "sButtonText": "Save", 
                      "aButtons": [ "csv", "xls", "pdf" ] 
                 } ] 
      } } 
  ); } );

      

End result: the table displays nicely formatted with the data filter function, but the Copy, Print, Save option appears on the screen.

Can anyone please advise why this is not working? My JS libraries are in the specified directories, so I'm a little confused. Thanks in advance.

+3


source to share





All Articles