Datatables page change callback

Question

I am using a function 'fnDrawCallback' for page change. It basically solves my purpose. The only thing is I have to specify that function when I am initializing dataTable object. Is there any way I can do it after initialization?

For Example: I am doing like this:

$("#tableID").dataTables({'fnDrawCallBack':functionName});

I want to do like this:

var oTable = $("#tableID").dataTables();
oTable.fnDrawCallback = functionName;    // or something like this

Solution:

oTable.aoDrawCallback.push(functionObj);
var functionObj = {
   fn: funtionName
};

Answer 1

You could access the internal data settings of DataTables to manipulate the draw callback array (aoDrawCallback, not fnDrawCallback internally - its an array since there can be multiple callbacks), or (and what I would suggest) you can add a 'draw' event listener:

var oTable = $("#tableID").dataTables();
$(oTable).bind( 'draw', functionName );

The events fired by DataTables are documented here: http://datatables.net/docs/DataTables/1.9.0/#summary_events

Answer 2

IF you have a version greater than 1.8, you can use this to hit the page change events:

    $('#myTable').on('page', function () {...} );

Hope this helps!

Answer 3

You probably saw this http://datatables.net/forums/discussion/2737/addchange-callback-after-initialization-or-else-clone-settings-to-re-build-table/p1

Answer 4

Rather than two separate calls, just add a .bind() prior to the .dataTable(), such as the following that runs a setMouseDown function whenever a page change occurs (including rendering the first page):

$('#myTable')
    .bind('page', setMouseDown())
    .dataTable( 
    { 
        bJQueryUI: true, 
        ... Other Init Stuff Here ... 
    });