Data loads quickly in IE8, but browser chokes on scrolling

Rypens

Hello,
I load my data with sAjaxScource, i have bDeferRender on true and i have the 1.9.1 version running. The data loads rapidly on all browsers (IE8 around 2 secs) but when all data is loaded, IE8 chokes when you start scrolling or clicking somewhere on the page (other browsers are fine). Other pages on the website are not experiencing this behaviour.

Any ideas? FYI, I'm using Datatables in tabs.

My code:

[code]
var table5 = $('#open').dataTable( {
"bProcessing": true,
"sAjaxSource": "<?= site_url(sprintf('status/gettable/%s/open', $dealer->dealerID)) ?>",
"bJQueryUI": true,
"bSortClasses": false,
"aaSorting": [[7,'desc']],
"bAutoWidth": true,
"bInfo": true,
"sScrollX": "100%",
"bDeferRender": true,
"aoColumnDefs": [
{ "bSortable": false, "aTargets": [ 8 ] },
{ "sClass": "bold", "aTargets": [ 4 ] },
{ "sClass": "charset", "aTargets": [ 5 ] },
{ "sWidth": "20%", "aTargets": [ 2 ] }
],
"sScrollXInner": "100%",
"iDisplayLength": 50,
"bScrollCollapse": true,
"sPaginationType": "full_numbers",
"bRetrieve": true,
"fnInitComplete": function () {
$("#dt5 .dataTables_length > label > select").uniform();
$("#dt5 .datatable tbody td").addClass("text");
$("#dt5 .dataTables_filter input[type=text]").addClass("text");
$(".datatable").css("visibility","visible");
}
} );

$(window).resize(function(){
if (table5) {
table5.fnAdjustColumnSizing();
}
});
[/code]

koosvdkolk

How big is your dataset? And could provide an example on http://live.datatables.net/#javascript,html,live?

Rypens

I'm only talking about around 200 lines...

Rypens

This is the Debug code in case you would like to know...
asadob

Rypens

Anyone? I really need an answer. Allan, do you have some time to formulate answer?

Rypens

Alright... After debugging for 5 days now, i found what slowed down my IE8 tables.
[code]$(window).resize(function(){
if (table5) {
table5.fnAdjustColumnSizing();
}
});[/code]

It seems that in IE8, the resize function is called, even when the window isn't resized... That's why the browser chokes.
Hope i helped someone else with this...

jcready

This should help all of you: https://github.com/louisremi/jquery-smartresize

allan

NIce link jcready - thanks for sharing that with us.

@Rypens - good to hear you got it fixed.

Allan

scrubber

@Rypens - thanks so much!! I am just finding myself caught in this hellish loop. The difference between browsers is so jarring, it's almost criminal... (I'm on IE8 also) How did you resolve this issue? The discussion seems to have trailed off.

@allan or jcready - it seems that window resize event on IE8 is stuck in an infinite loop *only* when I am calling fnAdjustColumnSizing inside the event.
1) Any idea why? (out of curiosity)
2) I tried calling w/ the debounced script, but the event still fires unprompted. What am I doing wrong? (Or, is it as I've suspected, calling fnAdjustColumnSizing causes a windows resize misfire in IE8?)
[code]
$(window).bind("debouncedresize", function() {
alert('event fired: '+ (+new Date()) );
// redraw the table according to new widths
oTable.fnAdjustColumnSizing();
});
[/code]