How to Call a javascript function after SAjaxsource completes in JQuery Datatables

Question

I'm using JQuery SAjaxsource How can i Call a javascript function after SAjaxsource completes. I want to update a div after the completion of the datatable load.Please help me...

Edit:

$(document).ready( function() {
                var oTable = $('#example').dataTable( {

                    "bServerSide": true,
                                    "sSearch":false,
                                    "aLengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]],
                                    "bPaginate": true,
                                    "bJQueryUI": true,
                                    "sPaginationType": "full_numbers",
                                    "sAjaxSource": "server_processingCDB1.php"
                } );

Answer 1

http://datatables.net/ref#fnDrawCallback also works for this, and saved you needing to override fnServerData.

Parameter: fnDrawCallback

Type: function

Inputs: {object}: DataTables settings object

This function is called on every 'draw' event, and allows you to dynamically modify any aspect you want about the created DOM.

$(document).ready( function() {
  $('#example').dataTable( {
    "fnDrawCallback": function( oSettings ) {
      alert( 'DataTables has redrawn the table' );
    }
  } );
} );

Answer 2

take a look at the fnServerData option in the callbacks section of the help -> http://www.datatables.net/usage/callbacks

Gives you everything you need ... here some example code :

$(document).ready(function() {
    $('#example').dataTable( {
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "../examples_support/server_processing.php",
        "fnServerData": function ( sSource, aoData, fnCallback ) {
            $.getJSON( sSource, aoData, function (json) { 
                /* Do whatever additional processing you want on the callback, then tell DataTables */
                fnCallback(json)
            } );
        }
    } );
} );

Answer 3

For datatables version 1.10.12

$('#table_id').dataTable({
  ajax: function (data, callback, settings) {
    $.ajax({
      url: '/your/url',
      type: 'POST',
      data: data,
      success:function(data){
        callback(data);
      }
    });
  }
});

Answer 4

Try this :

$('#listingData').dataTable({
    "sAjaxSource": "youAjaxSource.php",
    "fnDrawCallback": function (aoData) {
       response = aoData.jqXHR.responseJSON;
       console.log(response);
    }
});

For reload via fnReloadAjax

 $('#listingData').dataTable().fnReloadAjax("youAjaxSource.php", function (json) {
      console.log(json);
  });