Uncaught TypeError: Cannot read property 'TableTools' of undefined

Uncaught TypeError: Cannot read property 'TableTools' of undefined

zrxyjzrxyjzrxyjzrxyj Posts: 1Questions: 1Answers: 0

Chrome showed :
Uncaught TypeError: Cannot read property 'TableTools' of undefined dataTables.tableTools.js:3077
else if ( jQuery && !jQuery.fn.dataTable.TableTools ) {
My code:

jQuery(document).ready( function () { jQuery('#example').dataTable( { dom: 'T<"clear">lfrtip', tableTools: { "sSwfPath": "view/media/copy_csv_xls_pdf.swf" } } ); } );

I have tried almost all possible "sSwfPath" ,Chrome always says error.
What can I do for it?

Answers

  • mikedmiked Posts: 43Questions: 3Answers: 0
    edited August 2014

    I have the same problem, on Chrome as well, but also on FF 31.0

    var table = $('#example').DataTable({
    "processing": true,
    "serverSide": true,
    "ajax": "/example/getlistdata",

            dom: 'T<"clear">lfrtip',
            tableTools: {
                "sSwfPath": "/swf/copy_csv_xls_pdf.swf"
            }
        });
    

    path to sSwfPath is correct.

    Chrome developer tools show that "Uncaught TypeError: Cannot read property 'TableTools' of undefined" in datatables.tableTools.min.js line 69. Same problem in the non-min js file, line 3158 which reads:

    else if ( jQuery && !jQuery.fn.dataTable.TableTools ) {

    using jquery-1.11.1.min.js, pathed and loaded correctly

    Firebug on FF 31.0 shows "TypeError: jQuery.fn.dataTable is undefined". The error shows little d dataTable and I'm using big D (I'm not clear on the impact of using API vs object version of datatables yet) but changing it to little d dataTable still generates error.

    Latest versions of datatables and tabletools that I downloaded from here an hour ago.

    I'm out of magic - anybody?

  • tsmprittsmprit Posts: 10Questions: 3Answers: 0

    I have same problem as well.
    I cant load TableTools in latest wordpress
    , but datatable works.

  • allanallan Posts: 61,453Questions: 1Answers: 10,055 Site admin

    Can you link to a page showing the problem so it can be debugged please?

    Allan

  • mikedmiked Posts: 43Questions: 3Answers: 0

    Allan

    I'm heading out of town for the weekend in the next few hours, I can link the page and access to the source up for you on Monday on my staging server if no one else can do this prior.

    One thing I have not done is to take the thinned out source from the examples page and try that to make sure that worked. I did try to cut all other .js files from my source that were not dependencies to see if I could get the tabletools widget to load but the result was still the same with the same error.

    m

    -- didn't get email notification of replies to this thread --?

  • tsmprittsmprit Posts: 10Questions: 3Answers: 0

    I had to declare jquery in noconflict mode in wp to get it working


    jQuery( document ).ready(function( $ ) { // Setup - add a text input to each footer cell $('#example tfoot th').each( function () { var title = $('#example thead th').eq( $(this).index() ).text(); $(this).html( '<input type="text" placeholder="Search '+title+'" />' ); } ); // DataTable var table = $('#example').DataTable( { deferRender: true, dom: 'T<"clear">lfrtiSp', scrollY: 400, scrollX: 100, scrollCollapse: true, tableTools: { sSwfPath: "/wp-content/themes/intranet/swf/copy_csv_xls_pdf.swf", "aButtons": [ "copy", { "sExtends": "csv", "sCharSet": "utf8" }, { "sExtends": "xls", "sCharSet": "utf16le" }, { "sExtends": "pdf", "sPdfOrientation": "landscape", "sPdfMessage": "řžšžěžýzá" }, "print" ] } }); // Apply the search table.columns().eq( 0 ).each( function ( colIdx ) { $( 'input', table.column( colIdx ).footer() ).on( 'keyup change', function () { table .column( colIdx ) .search( this.value ) .draw(); } ); } ); } );
  • mikedmiked Posts: 43Questions: 3Answers: 0

    Allan,

    Did you still want to look at this directly?

  • mikedmiked Posts: 43Questions: 3Answers: 0

    was able to confirm that the tabletools example, basic initialization (http://datatables.net/release-datatables/extensions/TableTools/examples/simple.html) code did not show the TT widget.

    Link to the source and css/js libs I put together from the example: https://app.box.com/s/u3lt0mn49ztxtdbn1sj0

  • mikedmiked Posts: 43Questions: 3Answers: 0

    final test - from the basic initialization page linked above - I downloaded the js and css files that are linked via the js/html/css tabs under the example table to be sure that this wasn't a problem with my versions of any js code. Same result, table renders in datatable wrapper, but no TT widget.

    Uncaught TypeError: Cannot read property 'TableTools' of undefined

    Moved the source (link below) to a new virtual web server and reran the code, table renders in datatable wrapper, no TT widget

    Zip file of all the source files linked here: https://app.box.com/s/irwvbzt6j53gvmdfggwg

    Ubuntu 14.04 LTS, Apache/2.4.7 (Ubuntu) PHP/5.5.9-1ubuntu4.2

  • allanallan Posts: 61,453Questions: 1Answers: 10,055 Site admin
    edited August 2014

    script type="text/javascript" src="/dataTables.tableTools.js"
    script type="text/javascript" src="/jquery.dataTables.js"

    Try swapping the load order. TableTools is an extension for DataTables, so load DataTables first.

    Allan

  • mikedmiked Posts: 43Questions: 3Answers: 0

    yep, that's got it fixed in the example code I pulled from this site.

    loaded dataTables.tableTools.js after jquery.dataTables.js (opposite order of the example you quoted above)

    Will update my codebase and confirm that it's fixed there too

    thx for chiming in

This discussion has been closed.