How to pass ajax.dataSrc to $.fn.dataTable.pipeline method?

sathish_m

Actually i want to pipeline concept for lazy loading. but i am not able to understand how to pass dataSrc to $.fn.dataTable.pipeline method. please can one help me?

tangerine

See the dataTable initialisation in the example:

http://datatables.net/examples/server_side/pipeline.html

sathish_m

tangerine! thanks for your information. In that example only i am facing this issue. there is only data variable but there is no dataSrc. i am not able to understand how to configure dataSrc to the function $.fn.dataTable.pipeline. please tell me is there any another way.

allan

You would need to modify the pipeline function where it uses json.data to use whatever the data property name is that you are using. That isn't configurable in the current code for that example.

Allan

sathish_m

i replaced data property with dataSrc in $.fn.dataTable.pipeline method but i am getting following js error.

Uncaught TypeError: Cannot read property 'splice' of undefined.

at line
json.data.splice( requestLength, json.data.length );
in method $.fn.dataTable.pipeline.

allan

i replaced data property with dataSrc

Why would you do that? Is your data contained in a property called dataSrc? I don't see that change in your line of code above which still uses json.data.

What does your JSON data look like?

Allan

sathish_m

allen! Thanks for your response. ok! leave everything. i am using below code and it is working fine. below code is for get json data from apache solr and data displayed in datatable. but it is fetching all data at a time. but now we need to apply the pipeline concept for this. could you explain me how to apply pipeline concept for below code.

$('#example').dataTable( {
"ajax" : { "url": "../solr/collection1/select?q=<query>", "dataSrc" : "response.docs" },

"columns": [
{ "data" : "field1" },
{ "data" : "field2" },
{ "data" : "field3" },
{ "data" : "field4" },
{ "data" : "field5" },
{ "data" : "field6" },
{ "data" : "field7" },
{ "data" : "field8" },
],

"jQueryUI" : true
} );

allan

Change json.data in the pipeline function to json.response.docs.

Allan

sathish_m

Hi Allan thanks for your suggestion i changed json.data to json.response.docs. i am getting following error

Uncaught TypeError: Cannot read property 'length' of undefined

in line jquery.dataTables.min.js:36. please help to reslove this.

allan

Based on the information provided so far, as far as I am aware that should work. Can you please give me a link to the page you are working on so I can debug it.

Allan

sagarzope

I am also facing this same issue when I am trying to implement the pipeline processing.

My Json didn't have object name so I remove the "data" from "json.data" now its giving error in jquery.datatable.min.js script

"TypeError: c is undefined
...isplay=parseInt(d,10);c=sa(a,b);e=0;for(d=c.length;e<d;e++)J(a,c[e]);a.aiDisplay..."

allan

@sagarzope - Can you link to the page you are working on so I can debug it please?

Allan

sagarzope

Code for Ajax Pipeline

$(document).ready(function() {

                $.fn.dataTable.pipeline = function ( opts ) {
                    // Configuration options
                    var conf = $.extend( {
                        pages: 5,     // number of pages to cache
                        url: '',      // script url
                        data: null,   // function or object with parameters to send to the server
                                      // matching how `ajax.data` works in DataTables
                        method: 'GET' // Ajax HTTP method
                    }, opts );

                    // Private variables for storing the cache
                    var cacheLower = -1;
                    var cacheUpper = null;
                    var cacheLastRequest = null;
                    var cacheLastJson = null;

                    return function ( request, drawCallback, settings ) {
                        var ajax          = false;
                        var requestStart  = request.start;
                        var drawStart     = request.start;
                        var requestLength = request.length;
                        var requestEnd    = requestStart + requestLength;

                        if ( settings.clearCache ) {
                            // API requested that the cache be cleared
                            ajax = true;
                            settings.clearCache = false;
                        }
                        else if ( cacheLower < 0 || requestStart < cacheLower || requestEnd > cacheUpper ) {
                            // outside cached data - need to make a request
                            ajax = true;
                        }
                        else if ( JSON.stringify( request.order )   !== JSON.stringify( cacheLastRequest.order ) ||
                                  JSON.stringify( request.columns ) !== JSON.stringify( cacheLastRequest.columns ) ||
                                  JSON.stringify( request.search )  !== JSON.stringify( cacheLastRequest.search )
                        ) {
                            // properties changed (ordering, columns, searching)
                            ajax = true;
                        }

                        // Store the request for checking next time around
                        cacheLastRequest = $.extend( true, {}, request );

                        if ( ajax ) {
                            // Need data from the server
                            if ( requestStart < cacheLower ) {
                                requestStart = requestStart - (requestLength*(conf.pages-1));

                                if ( requestStart < 0 ) {
                                    requestStart = 0;
                                }
                            }

                            cacheLower = requestStart;
                            cacheUpper = requestStart + (requestLength * conf.pages);

                            request.start = requestStart;
                            request.length = requestLength*conf.pages;

                            // Provide the same `data` options as DataTables.
                            if ( $.isFunction ( conf ) ) {
                                // As a function it is executed with the data object as an arg
                                // for manipulation. If an object is returned, it is used as the
                                // data object to submit
                                var d = conf( request );
                                if ( d ) {
                                    $.extend( request, d );
                                }
                            }
                            else if ( $.isPlainObject( conf ) ) {
                                // As an object, the data given extends the default
                                $.extend( request, conf );
                            }

                            settings.jqXHR = $.ajax( {
                                "type":     conf.method,
                                "url":      conf.url,
                                "data":     request,
                                "dataType": "json",
                                "dataSrc" : "",
                                "cache":    false,
                                "success":  function ( json ) {
                                    cacheLastJson = $.extend(true, {}, json);

                                    if ( cacheLower != drawStart ) {
                                        json.splice( 0, drawStart-cacheLower );
                                    }
                                    json.splice( requestLength, json.length );

                                    drawCallback( json );
                                }
                            } );
                        }
                        else {
                            json = $.extend( true, {}, cacheLastJson );
                            json.draw = request.draw; // Update the echo for each response
                            json.splice( 0, requestStart-cacheLower );
                            json.splice( requestLength, json.length );

                            drawCallback(json);
                        }
                    }
                };

                // Register an API method that will empty the pipelined data, forcing an Ajax
                // fetch on the next draw (i.e. `table.clearPipeline().draw()`)
                $.fn.dataTable.Api.register( 'clearPipeline()', function () {
                    return this.iterator( 'table', function ( settings ) {
                        settings.clearCache = true;
                    } );
                } );


                //
                // DataTables initialisation
                //
                '''

Code for the datatable initialization'''

oTable =$('#example').dataTable( {
"processing": true,
"serverSide": true,
"autoWidth": false,
"ajax": $.fn.dataTable.pipeline( {
url: '/monitoring/dispatcherServlet/registrationController/getregistration?prof_ID='+obj[i].mp_ID,
pages: 5 // number of pages to cache
} ),
"columns": [
{
data: "duns",
render: function ( data, type, row ) {
if ( type === 'display' ) {
return '<input type="checkbox" id="'+data+'" onclick="getDuns('+data+');">';
}
//alert(data);
return data;
}
},
{ "data": "duns" },
{ "data": "organizationname" },
{ "data": "businesstype" },
{ "data": "organizationaddress" },
{ "data": "countrycode" }
],

                                         'aoColumnDefs': [{
                                                'bSortable': false,
                                                'aTargets': [-6] 
                                            }],
                          "bLengthChange": false,
                          "iDisplayLength": 14
                        });'''

sagarzope

my JSON is in following format

[{"status":"false","a":"b"}, {"status":"false","a":"b"}]

sagarzope

@allan : I cannot attached the page so I have given the part I am using for the datatable