Search code examples
jqueryjquery-uidatatablesjquery-ui-tabs

JQuery UI Tabs with AJAX content VERY slow using IE9


I am using JQuery UI Tabs with AJAX content.

The loaded data are a DataTables element with ~100 rows and 10 columns.

Everything is fine with FF, Chrome, Safari and Opera, but with IE9 the loaded table is very slow.

I tried to load the DataTable usin .load() method in IE9 and it is fine, but using JQueryUI tabs it is really not. I tried JQueryUI 1.8.22 and 1.9.1 but the behaviour is the same.

Is someone already dealt with this such of problem?

EDIT

In fact the problem is not bound with DataTables but due to "large" content loaded through AJAX into the tab. Futhermore, the loaded JS code, scroll and even CSS :hover are really not reactive


Solution

  • I used a fix tab content height. I don't understand why, by this slows down a lot the browser rendering in IE (8 and 9).

    To fix this problem, I replaced the fix tab content height by CSS property height:90% and add a fix table height to the datatable sScrollY": "1000px // 90% of the tab content height. I set up a window event on resize to redraw the datatable with the right value to fit the window size.

    I hope to help all people facing the same IE issue.