Datatables throwing error on window resize

Question

I have a DataTable.

When I set it, I get no errors, the table is properly generated, but then whenever I resize the window, I'm getting this error:

0x800a138f - JavaScript runtime error: Unable to get property 'style' of undefined or null reference

I don't think I can reproduce the code here, but I can guarantee that the table structure is correct.

This is what I'm using to create the DataTable:

function initDataTable() {
    if ($.fn.dataTable.isDataTable($('#grdPrincipal'))) {
        $('#grdPrincipal').DataTable().destroy();
        initDataTable();
    } else {
        $("#grdPrincipal")
            .DataTable({
                scrollY: 210,
                scrollX: true,
                fixedHeader: true,
                fixedColumns: true,
                paging: false,
                info: false,
                searching: false
            });
    }
}

Since I'm using a UpdatePanel in my asp.net webforms project, I have to run this code whenever I do a postback, because the table is rebuilt every time.

There are no problems with postbacks or anything, as I said, the only problem is when I resize the window.

What could it be?

Phiter · Accepted Answer · 2016-09-06 17:34:55Z

1

Try destroying the datatable before you update your updatePanel, like this:

var prm = Sys.WebForms.PageRequestManager.getInstance();
    function BeginRequestHandler(sender, args) {
        //Runs before updatePanel starts updating
        $('#grdPrincipal').DataTable().destroy();
    }

    function EndRequestHandler(sender, args) {
        initDataTable();
        //Runs after updatePanel has finished updating
    }
    prm.add_beginRequest(BeginRequestHandler);
    prm.add_endRequest(EndRequestHandler);

edited Sep 6, 2016 at 17:34

Phiter

15k14 gold badges52 silver badges87 bronze badges

answered Sep 2, 2016 at 17:50

RPichioli

3,3553 gold badges27 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

11 Comments

Phiter Over a year ago

I have done something different here and I have noticed that the first time the dataTable is created, I can resize the window as I wish, but after the updatePanel is reloaded, this error is thrown if I resize the window. When the updatePanel is reloaded, the table is rebuilt so it's not a datatable anymore.

Phiter Over a year ago

I have this -> function pageLoad() { initDataTable(); }

RPichioli Over a year ago

Hmm looks like you need another event callback.. the ".resize()" jQuery's feature. I'm writing it in my post, take a look in 1 minute.

RPichioli Over a year ago

Take a look now, hope it helps

Phiter Over a year ago

This actually kind of ruined my table. It's duplicating the rows.

|

Collectives™ on Stack Overflow

Datatables throwing error on window resize

1 Answer 1

11 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

11 Comments

Your Answer

Sign up or log in

Post as a guest

Related