process large datasets with post data

shorif2000

I am trying to process large datasets with post data, i cannot seem to add my own post data using this example or find any example that does do it. I want the table to be paginated and not scrollable.

https://datatables.net/extensions/scroller/examples/initialisation/server-side_processing.html

the place i am trying to implmenet into is

stackoverflow.com/questions/38053063/how-to-do-server-side-processing-on-large-dataset-on-jquery-datatables

jr42.gordon

Check out deferRender

shorif2000

Here is my up to date code. problem is it crashes the browser. the ajax is returning 30mb of data nearly 2000 rows

table_impact = $('#table_impact').DataTable({
            dom: 'lBfrtip',
            buttons: [
                'copy', 'csv', 'excel', 'pdf', 'print'
            ],
            serverSide: true,
            ordering: false,
            searching: false,
            deferRender: true,
            ajax: function ( data, callback, settings ) {
                var d = {};
                d.action = "impact";
                d.period = $("#group_period label.active").data("value");
                coordinator_group = $(".js-basic-multiple-coordinator-group-group").val();
                if(coordinator_group && coordinator_group.length > 0){
                    d.coordinator_group = [];
                    for( key in coordinator_group){
                        var obj = coordinator_group[key];
                        d.coordinator_group.push(obj);                                          
                    }
                }
                change_manager_group = $(".js-basic-multiple-change-manager-group").val();
                if(change_manager_group && change_manager_group.length > 0){
                    d.change_manager_group = [];
                    for( key in change_manager_group){
                        var obj = change_manager_group[key];
                        d.change_manager_group.push(obj);                                           
                    }
                }
                company = $(".js-basic-multiple-company").val();
                if(company && company.length > 0){
                    d.company = [];
                    for( key in company){
                        var obj = company[key];
                        d.company.push(obj);                                            
                    }
                }
                status = $(".js-basic-multiple-ticket-status").val();              
                if(status && status != 'null' && status.length > 0){
                    d.status = [];
                    if(typeof status == "string"){
                        d.status = status.split(",");
                    }else{
                        for( key in status){
                            var obj = status[key];
                            d.status.push(obj);                                         
                        }
                    }
                }   
                ops_cat_tier1 = $(".js-basic-multiple-ops-cat-tier1").val();
                if(ops_cat_tier1 && ops_cat_tier1.length > 0){
                    d.ops_cat_tier1 = [];
                    for( key in ops_cat_tier1){
                        var obj = ops_cat_tier1[key];
                        d.ops_cat_tier1.push(obj);                                          
                    }
                }
                pou_id = $(".js-basic-multiple-pou").val();
                if(pou_id && pou_id.length > 0){
                    d.pou_id = [];
                    for( key in pou_id){
                        var obj = pou_id[key];
                        d.pou_id.push(obj);                                         
                    }
                }

                var self_serve = $.ajax({
                    url: base_url + 'api/change/self-serve',
                    type: "POST",
                    data : d
                });
                $.when(self_serve).done(function(widgetData){
                    setTimeout( function () {
                        callback( {
                            draw: widgetData.draw,
                            data: widgetData.data,
                            recordsTotal: widgetData.recordsTotal,
                            recordsFiltered: widgetData.recordsFiltered
                        } );
                    }, 50 );
                
                }).fail(function(error){
                    api.log('== ERROR ===');
                    api.log(error.responseText);
                }).always(function(){
                    //api.hideActivityIndicator();
                });
            },
            columns: [
                    { "data": "CHANGE_ID" },
                    { "data": "SCHEDULED_START_DATE_GMT" },
                    { "data": "SCHEDULED_END_DATE_GMT" },
                    { "data": "POU_ID" },
                    { "data": "SUMMARY" },
                    { "data": "STATUS" },
                    { "data": "COMPANY" },
                    { "data": "CUSTOMER_PID" },
                    { "data": "SITE_GROUP" },
                    { "data": "SERVICE_STATUS" },
                    { "data": "CIRCUIT_ID" },
                    { "data": "ADDRESS" },
                    { "data": "SERVICE_IMPACT" },
                    { "data": "SERVICE_TYPE" },
                    { "data": "SERVICE_MODEL" },
                    { "data": "OTHER_REF" },
                    { "data": "TAIL_REF" },
                    { "data": "KEY_OWNER" },
                    { "data": "RECEIVES_COMMS" },
                ],
            scrollY: 200,
            scroller: {
                loadingIndicator: true
            }
            /*responsive:true,
            processing:true,
            deferRender: true,
            searchHighlight: true,
            //scrollY:        200,
            //scroller:       true,
            //"bSortClasses": false,
            //serverSide: true,
            searching: false*/
        });

jr42.gordon

I am going to let @allan speak on this, as I don't use DataTables with ajax feature.