Tabbutton serverside ajax request not working after second time

FiezDev

I made a table with tabs that send an AJAX request to the server-side.
Each tab queries the same table, but with different columns and filters.
However, when I click on a tab, it works the first time, but after the second click,
the tbody of the table disappears and the AJAX requests is not send.
I want to know how to fix this issue so that I can click on the tabs back and forth without any problems.

Example Code That i use in tab.

    $('#tabAll').on('click', function () {
        currenttab = 'tab_all';
        pageConfig = tabConfig_all;
        table.clear().destroy();
        $('#example').empty();
        $('#example').DataTable({
            columns: pageConfig.columns_Config,
            ajax: {
                url: pageConfig.ajax_url,
                data: pageConfig.ajax_data
            },
            columnDefs: pageConfig.columnDefs_Config}
        );
    });

Test Case:
http://live.datatables.net/kemexone/1/edit

kthorngren

Looks like you need to get a new instance of the Datatable API after using destroy(). Like this:
http://live.datatables.net/kemexone/2/edit

Kevin

FiezDev

Thanks that work!!