Getting TypeError: d is null message after trying to destroy and re-initialize datatable

MikeB-TC

I'm trying to populate a DataTable after a successful login. I'm using an Ajax call for the login and on success it calls a function to initialize and load the DataTable. Since there could be multiple logins I want to destroy the DataTable and then recreate it to prevent the DataTable already initialized error but when the table is destroyed and re-initialized I see the table but there is no data and I get the following 2 errors and can't figure out what's causing them.

The source code to create I'm using to initialize an populate the DataTable

function loadGateways() {

        if ($.fn.DataTable.isDataTable('#gateways')) {
            $('#gateways').DataTable().clear().destroy();
        }

        $('#gateways').DataTable({
            ajax: {
                url: "/api/gateways",
                dataSrc: "gateways"
            },
            columns: [
                {data: 'gwid'},
                {data: 'name'},
                {data: 'street'},
                {data: 'locality'},
                {data: 'region'},
                {data: 'postal_code'},
                {data: 'country'},
            ]
        });
    }

colin

Yep, that should work. It would be worth looking at the 404 error in the image you posted - that could be giving odd effects. If that doesn't help, we're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin