'Getting error - TypeError: DataTable.fnDestroy is not a function

I have following code that is using data table

Contact.dataTable = $('#table').dataTable( {
.............
},
 $('#table tbody').on('click', '.position', function () {
            var row = this.parentElement;
             var data = Contact.dataTable.row(row).data();
...
}

Since above code was giving error "TypeError: Contact.dataTable.row is not a function", I have changed every dataTable to DataTable. But now it gives error "TypeError: Contact.DataTable.fnDestroy is not a function".

Below is the code that gives error

Contact.DataTable = $('#table').DataTable( {
    .............
    },
     $('#table tbody').on('click', '.position', function () {
                var row = this.parentElement;
                 var data = Contact.DataTable.row(row).data();
    ...
    }

if('DataTable' in Contact) {
            Contact.DataTable.fnDestroy();
}

Anyone please help!



Solution 1:[1]

It seems to be the difference between...

_table = jQuery('table#fp-table-table').dataTable(); // .fnDestroy() works and

_table = jQuery('table#fp-table-table').DataTable(); // .fnDestroy() doesn't work DataTable seems to be for API calls back into the object and dataTable seems to be the intialisation method.

In my project I had changed the initialisation to use DataTable instead of dataTable to perform a filtering task. After this my AJAX reloads would throw the 'undefined' error, so I changed it back... i esta.

Solution 2:[2]

See this thread here - it talks about the difference between .DataTable() and .dataTable().

Solution 3:[3]

Declare var Contact = $('#table').DataTable at the top and then use it Like Contact.fnDestroy() It worked For me so give it try

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 nihaoqiulinhe
Solution 2 colin0117
Solution 3 Rushabh Gandhi