angularjs - Server side pagination is not rendering the table data -

i trying pagination server side. project tech stack mongodb + spring + angular + angular-datatables.

mongodb provides simple method retrieve data according pagination , sorting parameters

url fetch data pasted here 'post' request , send few other parameters request body

 /myapp/products/filter?pagesize=10&pageno=1 

after googling , going through jquery datatables manual, found out how make in angular-datatables. pasted code below:

     vm.dtoptions = dtoptionsbuilder.newoptions().withoption('ajax', {             url : '/myapp-api/products/filter',             type : 'post',             contenttype : 'application/json',             datatype :'json',             accepts: "application/json",             headers: {                 accept: "application/json",                 authorization : 'bearer eyj0exaio.eyjpzci6iju1ohsbntdmioq1y'             },             data:function(d){                      var pageno = d.start;                  var pagesize = d.length;                      return json.stringify( d );             },             success:function(response){                 console.log(" ajax > post > success > response > ", response);                 var page = {                     "draw":1,                     "data" : response.list,                     "recordstotal" :response.list.length,                     "recordsfiltered" :response.list.length                 };                 return page;             }         })         .withdataprop('data')         .withoption('processing', true)         .withoption('serverside', true)         .withpaginationtype('full_numbers'); 

i able receive response datatable not displaying data. in success function callback, returning data per format mentioned in datatables web pages.

along side, have few more queries:

1. can use $http.post method retrieve data server, understand datatables has mechanism calling ajax on each action done in datatables.

2. the data: function(){} gives me entire datatable column , other details in object format, used json.stringify(data) workaround.

my server side implementation expects json data , need few parameters out of it.

has here has done implementation using $http.post method. when tried it, giving me error:

typeerror: cannot read property 'adatasort' of undefined

    $scope.dtoptions = dtoptionsbuilder.newoptions()      .withoption('ajax', function(data, fncallback, settings) {             $http.post('/myapp/products/filter?pageno=1&pagesize=10', {}).then(function(response) {                   fncallback(response);      });           })     .withdataprop('list')     .withoption('processing', true)     .withoption('serverside', true)     .withpaginationtype('full_numbers'); 

see corrected code below.

you're not setting pageno , pagesize url parameters correctly.

also according manual, success method must never overwritten being used datatables internally. instead can define callback withdataprop called when response received server.

please note server-side processing draw parameter value in response has match draw parameter value in request. i'm using vm object store value between request , response.

another thing worth mentioning need use datatables version 1.10.6 or later code work.

vm.dtoptions = dtoptionsbuilder.newoptions().withoption('ajax', {        url : '/myapp-api/products/filter',        type : 'post',        contenttype : 'application/json',        datatype : 'json',        accepts: "application/json",        headers: {            accept: "application/json",            authorization : 'bearer eyj0exaio.eyjpzci6iju1ohsbntdmioq1y'        },        data: function(d, settings){            var api = new $.fn.datatable.api(settings);             // update url            api.ajax.url(               '/myapp-api/products/filter?pageno=' + d.start + '&pagesize=' + d.length            );             // store "draw" parameter            vm.dtdraw = d.draw;             return json.stringify(d);        }    })    .withdataprop(function(json){        console.log(" ajax > post > success > response > ", json);         // retrieve "draw" parameter        json.draw = vm.dtdraw;         json.recordstotal = json.list.length;        json.recordsfiltered = json.list.length;         return json.list;    })    .withoption('processing', true)    .withoption('serverside', true)    .withpaginationtype('full_numbers');