Cfrgtkky

I have a jquery dataTable which sends a request to MVC controller using ajax and displays the data.
It works fine with client side processing but response time is too slow because it retrieves all the records.

To make it faster server side pagination is required.
The issue with server side pagination is that setting server side pagination to true in jquery datatable it makes multiple ajax requests.

I have been debugging it a lot but cant figure the problem which causes multiple ajax requests. I have implemented many different ways available on google but nothing worked.

How to make it work using server side pagination?
How can I prevent multiple ajax calls? ( table is initialized under document.ready() )

document.ready(function() {



            $("#myTable").DataTable({

            "processing": true, // for show progress bar

            "serverSide": true, // for process server side

            "orderMulti": false, // for disable multiple column at once

            "ajax": {

                "url": "/home/LoadData",

                "type": "Get",

                "datatype": "json"

                "data":{ date:'date'},// parameter on controller to filter records 

            },

            "columns": [

                    { "data": "ContactName", "name": "ContactName", "autoWidth": true },

                    { "data": "CompanyName", "name": "CompanyName", "autoWidth": true },

                    { "data": "Phone", "name": "Phone", "autoWidth": true },

                    { "data": "Country", "name": "Country", "autoWidth": true },

                    { "data": "City", "name": "City", "autoWidth": true },

                    { "data": "PostalCode", "name": "PostalCode", "autoWidth": true }

            ]

        });

The data returned on first call is exactly what I want but multiple requests make it worse.

I was adding the data to table on ajax success method even though I had defined the column definitions for it.
Removing the success method solved the problem.