Destroy table troubles

bkates

I'm not sure why I'm having so much trouble with this.. I'm trying to destroy a table. The error is: Uncaught TypeError: Cannot read property 'dt' of undefined

Code:

I have a function that's triggered by a dropdown select menu.

var table

function onChange() {

if ( table != null ) {
    table.destroy();
    $("#weeklySalesTable").empty();
}

...

table = $('#weeklySalesTable').DataTable( {
                          "scrollY": "600px",
                          "scrollX": true,
                          "paging": true,
                          "lengthMenu": [ [25, 50, 100], [25, 50, 100] ],
                          "info": true,
                          "deferRender": true,
                          "ordering": false,
                          "fixedColumns":   true,
                          "scrollCollapse": true,
                    } );

}

allan

I think you are probably encountering a bug in the current release of FixedColumns I'm afraid. Could you try using the nightly version and see if that resolves the issue.

Thanks,
Allan

bkates

Hmm, I removed fixedColumns: true and now I'm getting: datatables.min.js:78 Uncaught TypeError: Cannot read property 'aDataSort' of undefined

bkates

Hmm wait, I also removed scrollCollapse and now I'm not seeing any errors... that might do it

bkates

No, I'm seeing datatables.min.js:78 Uncaught TypeError: Cannot read property 'aDataSort' of undefined

Here's what I'm including (note: no fixed cols)

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/t/bs/dt-1.10.11,af-2.1.1,b-colvis-1.1.2,cr-1.3.1,fh-3.1.1,kt-2.1.1,r-2.0.2,rr-1.1.1,sc-1.4.1,se-1.1.2/datatables.min.css"/>

And my table:

table = $('#weeklySalesTable').DataTable( {
"scrollY": "600px",
"scrollX": true,
"paging": true,
"lengthMenu": [ [25, 50, 100], [25, 50, 100] ],
"info": true,
"deferRender": true,
"ordering": false
} );

bkates

I changed my imports to:

<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/t/bs/dt-1.10.11,af-2.1.1,b-colvis-1.1.2,cr-1.3.1,fh-3.1.1,kt-2.1.1,r-2.0.2,rr-1.1.1,sc-1.4.1,se-1.1.2/datatables.min.css"/>
<script type="text/javascript" src="https://cdn.datatables.net/t/bs/dt-1.10.11,af-2.1.1,b-colvis-1.1.2,cr-1.3.1,fh-3.1.1,kt-2.1.1,r-2.0.2,rr-1.1.1,sc-1.4.1,se-1.1.2/datatables.min.js"></script>

<link rel="stylesheet" type="text/css" href="https://nightly.datatables.net/fixedcolumns/css/fixedColumns.dataTables.min.css"/>
<script type="text/javascript" src="https://nightly.datatables.net/fixedcolumns/js/dataTables.fixedColumns.min.js"></script>

And left my table as:

table = $('#weeklySalesTable').DataTable( {
                          "scrollY": "600px",
                          "scrollX": true,
                          "paging": true,
                          "lengthMenu": [ [25, 50, 100], [25, 50, 100] ],
                          "info": true,
                          "deferRender": true,
                          "ordering": false,
                          "fixedColumns":   true,
                          "scrollCollapse": true,
                    } );

Error: datatables.min.js:78 Uncaught TypeError: Cannot read property 'aDataSort' of undefined

allan

Can you link to the page so I can debug it please? Alternatively, a test case can be created at http://live.datatables.net or JSFiddle.

Allan

bkates

Sure, I'll try to get around to it. For now, I just removed the table element from the DOM and re-appended.

prezmoten

Is there any solution to this problem, I'm also getting 'Cannot read property 'dt' of undefined' when I use "fixedColumns": true, ?

allan

If you link to the page showing the issue I can take a look.

Allan

CamillaLFL

same problem here，it seems the fixcolumn and destroy could't be used together.
How to solve the problem?

allan

As I request above, if you could give a link to a page showing the issue, that would be great.

Here is an example of it working without error: http://live.datatables.net/xuhivulo/1/edit .

Allan