Help - Header squished if vertical scrolling is enabled

RelaySignal

I've tried everything I could think of - upgrading to 1.9.2 (Using 1.9.0 right now), changing options - I just can't seem to fix the headers squishing down when the page is loaded, if vertical scrolling is enabled. Without it, it loads fine. Sorting the table after the page loads also works fine. Here's my code:

[code]
$(document).ready(function () {
oTable = $('#tblportVolMiniPositions').dataTable({
"bProcessing": true,
"fnStateLoadCallback": function (oSettings, oData) {
oData.sFilter = "";
return true;
},
"bScrollAutoCss": true,
"sScrollY": "450px",
"bPaginate": false,
"bAutoWidth": true,
"bJQueryUI": true,
"aaSorting": [[1, "asc"]],
"fnInitComplete": function () {
this.fnAdjustColumnSizing(true);
},
"oLanguage": {
"sSearch": "Filter Records:",
"sLengthMenu": "Display _MENU_ records per page",
"sZeroRecords": "No Records found.",
"sInfo": "Showing _START_ to _END_ of _TOTAL_ records",
"sInfoEmpty": "",
"sInfoFiltered": "(filtered from _MAX_ total records)"
},
"sDom": 'Rt<"F"ip>l',
"oColVis": {
"aiExclude": [0, 1, 2, 3]
},
"aoColumnDefs": [
{ "bSortable": false, "aTargets": ["nosort"] },
{ "bVisible": false, "aTargets": ["hiddenCol"] },
{ "bSearchable": false, "aTargets": ["nosearch"] },
{ "sType": "html", "aTargets": ["htmlData"] },
{ "sType": "date", "aTargets": ["dateData"] },
{ "sType": "string", "aTargets": ["textData"] },
{ "sType": "numeric", "aTargets": ["numberData"] },
{ "sWidth": "25px", "aTargets": ["smallCell"] }
]
});
$(window).bind('resize', function () {
oTable.fnAdjustColumnSizing();
});
});




...
[/code]

The page is loaded dynamically via AJAX, so it probably has something to do with how it's initially loaded. Here's an image of what it looks like when the page first loads: http://i.imgur.com/kbVkS.png

allan

Looking at your screenshot I would say it is odds on that there is a Javascript error on the page. What does your browser's console say? Can you give us a link to let us debug further please?

Allan

bradykurtz

I am haveing the same issue. No Javascript error. Any Help?

allan

As I suggested in my previous post, we need a lot more information to even have a chance of being able to help with this one! Please link me to a test page showing the problem.

Allan

neils

Having the same issue I noticed that this error happens when using the Bootstrap framework. I haven't yet found any workaround however :-(

allan

Can you link to a page showing the problem please? Also are you using the very latest files: https://github.com/DataTables/Plugins/tree/master/integration/bootstrap ?

Allan

neils

[quote]Also are you using the very latest files[/quote]
I guess I am... :-)
[quote]Can you link to a page showing the problem please?[/quote]
You can see it here, clicking on the second accordion header in the right-side content panel:
http://developer.triplexweb.hu/demo.html
The header widths get their normal size after scrolling down the datatable.
Thank you for having a look on the page.
Neils