Cannot get Datatables and Jquery Tabs to display correctly

Question

there is a working example on the datatables website here: http://datatables.net/release-datatables/examples/api/tabs_and_scrolling.html

BUT, i believe the example is using jquery-ui 1.8 something and this example no long work for the newer versions of jquery-ui. Specifically this code:

"show": function(event, ui) {
  var table = $.fn.dataTable.fnTables(true);
  if ( table.length > 0 ) {
    $(table).dataTable().fnAdjustColumnSizing();
  }
}

i believe the "show" event is deprecated: http://jqueryui.com/upgrade-guide/1.9/#deprecated-show-event-renamed-to-activate

i tried replacing "show" with "activate", but it doesn't seem to work. Has anyone else has this problem? i can't figure out how to make it work.

Answer 1

Here is a working example which uses activate and the latest versions of jQuery and jQuery UI http://jsfiddle.net/5AavQ/3/ . Check External Resources to see what files were included. Make sure to include all external .js (jQuery, jQuery UI, DataTables) and .css (jQuery UI, DataTables Demo is optional) files.