How do you access the Scroller extension API on the latest DataTables CDN code?

boidy

I am using a Bootstrap Modal to contain the table, and I have successfully initialized the DataTable instance in the hidden div, and got it to resize the columns when the modal is shown. The problem is when I try to use the Scroller extension on this table, it doesn't render properly, and I can't figure out the correct syntax to use to access the fnMeasure function on the Scroller API. Everything I've tried so far results in fnMeasure not defined, or scroller not defined or similar.

Here is my current attempt:

$(document).ready( function () {

  var table = $('#example').DataTable({
    "scrollY": '200px',
    "dom": 'ftiS'    
  });

  $('#show_modal_btn').on('click', function(){
    $('#table_modal').modal('show');
  });

  
  $('#table_modal').on( 'shown.bs.modal', function(e){
        table.columns.adjust().oScroller.fnMeasure();

    });

} );

I've created a test case here

Also note that the the Scroller CSS (I think), doesn't play nicely with Bootstrap CSS, as the filter box gets obsured by the tables header.

boidy

For anyone else who stumbles across this, the documentation on the Scroller Extension needs updating. I've looked through the source code and the correct way to access the scroller API is now table.scroller().measure();

Example

allan

Thanks for pointing that out. I need to update the documentation for most of the extensions to the new 1.10 style to keep them always up-to-date. Responsive is the only extension that uses this method at the moment, all the others are stop gaps (but should still be update to date - I'll fix this!).

Allan