Pagination Not Working on DataTable Server-Side !

Rikk_Mor

Hi all,
I am facing one issue while trying to implement server-side in the datatable.
I have followed the docs but am stuck at pagination, table is showing _ Showing 0 to 0 of 0 entries (filtered from NaN total entries)_ .
My code-

$('#dataTable').DataTable().destroy();
                $scope.tableData=data;
                $('#dataTable').ready(function () {
                    $('#datatable').DataTable( {
                        columns: [
                            { "data": "firstName" },
                            { "data": "lastName" },
                            { "data": "email" }
                        ],
                        "processing": true,
                        "serverSide": true,
                        "ajax":{
                            "url": "ApiToLoadData",
                            "dataType": 'json',
                            "type": "GET",
                            "beforeSend": function(xhr){
                                xhr.setRequestHeader("Authorization",
                                    "Bearer Token");
                            },
                            "data": function ( d ) {
                                if(d.start > 1){
                                    d.pageNumber = d.start/10;
                                }else{
                                    d.pageNumber = d.start;
                                }
                                d.size = d.length; //sending length of the table
                                d.field = ""; //field is the column name which need to be sorted
                                if(d.order[0].column == 0){  //written logic to send hardcode name to backend based on column number
                                    d.field = "firstName";
                                }else if(d.order[0].column == 1){
                                    d.field = "lastName";
                                }else if(d.order[0].column == 2){
                                    d.field = "email";
                                }
                                console.log("final Payload to make reques",d);
                            },
                            "dataSrc": function ( json ) {
                                var newData = Object.assign({}, json);
                                delete newData.totalElements;
                                newData.recordsTotal = 100; // tried with hardcoded value
                                newData.recordsFiltered = 100; // tried with hardcoded value
                                newData.data=json.content;
                                delete newData.deletingAllUnnecessaryObjects;
                                newData.draw = json.number;

                                // return newData.data;        // if I return newData.data then data is showing on table. but still pagination is working but number of records and buttons are not correct

                                var finalDataArrayObj={};
                                finalDataArrayObj.data = json.content;
                                finalDataArrayObj.recordsTotal = 100;
                                finalDataArrayObj.recordsFiltered = 100;
                                finalDataArrayObj.draw = json.number;

                                return finalDataArrayObj; // if I pass a new object then data is not showing on table. pagination not working
                            }
                        }
                    });
                })

I am using data property to pass only the required things table needs to render.
I am sure there must be some issues in returning the data. Can I get help in this.
Thanks

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

colin

What does your server-side script return - just a snippet would be useful? Likewise the output to your ajax.dataSrc,

Colin