jquery - Custom data source property dataSrc and pagination issue

Question

I'm working with jQuery DataTables and server-side processing mode. But I'm facing an issue with data table, I've search every thing in Datatables documentation but couldn't find my answer.

So the problem is I'm getting response from server as JSON like this:

As you can see in this JSON response, datatables required JSON is in data.data to set this data source in datatables there is a property which is Custom Data Property and it working fine and shows the rows. Now problem is that datatables is not considering pagination parameters from JSON which is why it show's this:

Please note that I cannot change JSON response from server side.

Update: Here is js call script:

$(document).ready(function () {
   $("#example").dataTable({
      "ajax": {
          url: app.getApiUrlWithAccessToken('lead/get_all'),
          dataSrc: function(json){
              return json.data.data;
          }
      },
      "lengthMenu": [1,2,5,10,15],
      "columns": [
          { "data": "first_name" },
          { "data": "last_name" },
          { "data": "title" },
          { "data": "email" },
          { "data": "city" },
          { "data": "status" }
      ],
      "processing": true,
      "serverSide": true
   });
});

Answer 1

CAUSE

In server-side processing mode DataTables expects certain structure in returned data. Parameters draw, recordsTotal and recordsFiltered should be top-level properties. You response has these parameters as sub-properties of data, not where DataTables would be looking for them.

SOLUTION

Set parameters draw, recordsTotal and recordsFiltered as top-level properties of JSON response where DataTables expects them to be.

Use the following code for ajax.dataSrc option:

dataSrc: function(json){
   json.draw = json.data.draw;
   json.recordsTotal = json.data.recordsTotal;
   json.recordsFiltered = json.data.recordsFiltered;

   return json.data.data;
}

DEMO

See this jsFiddle for code and demonstration.