Cannot read property 'clientWidth' of null jquery.dataTables.min.js:63

amritleen

Hi All! I am new to datatables. I am using this to display results from ajax call.

On a single page, I have user form and the result section. User fills the details and submit. On this, datatable is displayed. This works perfectly fine. But when user updates anything on the form and submits it, I am trying to destroy datatable and recreate it. Doing this, i am getting the error - clientWidth of undefined. Below is the code -

function CBResults(response){
var dataArray = response.data;

if ($.fn.DataTable.isDataTable("#thetable")) {
    $('#thetable').dataTable();
    $('#thetable').DataTable().clear().destroy();


}
var html = '<tbody>';
for(var i = 0; i < dataArray.length; i++)
    html += '<tr><td></td></tr>';  // code to populate columns of the table

html += '</tbody>';


    $('#thetable thead').first().after(html);

    $('#thetable').DataTable( {
        retrieve: true,          
        dom: 'Blfrtip',
        scrollY: "300px",
        responsive: true,
        scrollX:        true,
        scrollCollapse: true,
        columnDefs: [ {
            targets: [4,5,6,7,8,9,10,11],
            render: $.fn.dataTable.render.ellipsis(10)
        } ], 
        buttons: [
            'colvis','copy', 'csv', 'excel', 'pdf'  
        ],
        fixedColumns:   {
            leftColumns: 2
        },

         "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]]
    } );

}

Let me know what I am doing wrong and how can I correct it? Appreciate quick reply on this.

colin

Hi @amritleen ,

Is this the same issue as your other thread? Can this one be removed?

Cheers,

Colin

amritleen

Yes. This can be removed/closed.

allan

This is the other thread in case anyone finds this one.