manraj82
manraj82

Reputation: 6325

jquery data tables - Server-side processing not working as expected

I have got a JSON object that I receive from a php file,the JSON object is created as per the specified format.But I get the the warning UNRESPONSIVE SCRIPT.I have got over 50,000 records and it loads every record instead of the 20 records I specified in the iDisplayLength parameter. I know Im doing something wrong,please help.

The JSON Object :

{
    "iTotalRecords":"52000",
    "iTotalDisplayRecords":"52000",
    "sEcho":0,
    "aaData":[
        {"itemID":"13901","itemName":"Item 1","itemModel":"Model 1","Price":"20"},
        {"itemID":"13902","itemName":"Item 2","itemModel":"Model 2","Price":"30"},
        {"itemID":"13903","itemName":"Item 3","itemModel":"Model 3","Price":"50"},
        {"itemID":"13904","itemName":"Item 4","itemModel":"Model 4","Price":"60"},
        {"itemID":"13905","itemName":"Item 5","itemModel":"Model 5","Price":"20"},
        ................
    ]
}    

$(document).ready( function () {
        $('#tbItems').dataTable( {
                        "bProcessing": true,
                        "bServerSide": true,
                        "sAjaxSource": "getItems",
                        "aoColumns": [
                          { "sTitle": "itemID",  "mDataProp": "itemID" },
                          { "sTitle": "itemName",  "mDataProp": "itemName" },
                          { "sTitle": "itemModel", "mDataProp": "itemModel" },
                          { "sTitle": "itemPrice",  "mDataProp": "itemPrice" }
                        ],
                        "sPaginationType": "full_numbers",
                        "bLengthChange": false,
                        "iDisplayLength": 20,
                        "aaSorting": [[ 1, "asc" ]]
        });
    });

Upvotes: 0

Views: 10604

Answers (1)

ShadowScripter
ShadowScripter

Reputation: 7369

The server can only pass a certain amount of data through a request.

Essentially, what datatables is doing, is, even though you define a display parameter, it will still fetch all the data from your source and then process it.

Datatables fetches the data and then processes everything and puts it in an internal array. I can only imagine how much space it would take up after only a couple of hundred rows.

In any case, the bServerSide boolean notifies datatables that you're going to handle and process everything yourself and then feed back what you want. You should read up on the documentation and examples available at datatables.net.

You should pay close attention to how they do the server side processing since it is perfect for your scenario where you have a huge dataset to work with.

The last one shows a complete reference to how to manage large datasets and how to do the paging, and pretty much everything, on the server side, effectively saving up loads of processing time for datatables.

Your problem is that you're returning everything but forgetting to filter the data to only include the rows on the current "page". This is all done on the server-side, hence the variable name.

Upvotes: 3

Related Questions