FixedHeader is not responsive

islamelshobokshy

I'm using fixed header with bootstrap, but it's not responsive. It's just .. fixed, and doesn't move right and left with the table. Any ideas why? I want it to be initiated with each column of the table, and not just get fixed by brute force.

        new $.fn.dataTable.FixedHeader( oTable, {
            alwaysCloneTop: true
        });

colin

Hi, if you could link to a test case, we'd be happy to take a look.

allan

This shows it with Responsive. As Colin notes, we'd need a test case showing the issue to be able to help.

Allan

islamelshobokshy

I can't reproduce my problem in a test, I'll try explaining it. When I scroll down I get the fixed header, when I scroll right, the bar stays fixed nonetheless at the same place, it doesn't move with the table, in other words it's left style stays the same and doesn't move I suppose it's not a problem with DataTables but with my JS files or something

islamelshobokshy

I got 2 errors in console too.

dataTables.fixedHeader.min.js:14
Uncaught TypeError: Cannot read property 'FixedHeader' of undefined

dataTables.responsive.min.js:26
Uncaught TypeError: Cannot read property 'Api' of undefined

islamelshobokshy

http://live.datatables.net/giqetigu/1/edit
Test example

islamelshobokshy

It works here, by just changing the version of the fixed header to 3.1 :
http://live.datatables.net/vimazaxu/1/edit

But in my code it doesn't work. Is there something wrong with bootstrap scrolling and DataTables headers? or am I missing something?

allan

Yes, your example where it doesn't work is using FixedColumns 3.0.0 for some reason. There is indeed a bug in that version. 3.1.3 is the current release, which works per your example.

To be able to help I would need a link to a page showing the issue.

Allan

coderzero8

im faceing the same issue , it only becomes responsive to table rows when i click headers rows for sorting.

colin

@coderzero8 Can you link to your page or create a test case so we can progress this, please. 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