FixedHeader shows only if window is resized or if table is sorted by clickinf on a header title

FixedHeader shows only if window is resized or if table is sorted by clickinf on a header title

m_tsatsaronim_tsatsaroni Posts: 7Questions: 3Answers: 0

I am new to datatables and i am trying to display Fixedheader.

When the table is first loaded, the FixedHeader
is a no show. When the windows is resized or clicked on one of the tables' header to sort then it appears.

I tried so far after table draw():
columns.adjust()
fixedheader.adjust()

My test case is here:
https://www.villas-mina.com/new2/index_test_datatables.html

This question has an accepted answers - jump to answer

Answers

  • kthorngrenkthorngren Posts: 17,723Questions: 25Answers: 4,204
    Answer ✓

    You have this code:

            populate_all_data(obj);
        
            msg_div.style.display  = 'none';
            tbls_div.style.display = 'block';
            msg_div.innerHTML      = '';
    

    In the update_alltab() function. It looks like the Datatable is populated in a hidden div then you display it. Move the columns.adjust() and fixedHeader.adjust() calls after the tbls_div.style.display = 'block'; statement.

    The problem with those calls being here:

            load_all_data();
            
    //      var t = $('#maintable').DataTable();
    //      t.columns.adjust();
    //      t.fixedHeader.adjust();
    

    Is that oad_all_data() is using an XHR request which is asynchronous. So the t.columns.adjust();, etc runs before the XHR response and the table is loaded.

    Kevin

  • m_tsatsaronim_tsatsaroni Posts: 7Questions: 3Answers: 0

    It was so simple. It is when it is actually displayed so the elements' dimensions are calculated right?
    Thank you so much for your time.

Sign In or Register to comment.