Service Processing - Uncaught TypeError: Cannot read property 'length' of undefined

viju

Hi,

I am new to datatables and have been struggling to implement server-side processing. As my application is being developed using AngularJS - I have considered angular-datatables as wrapper. Below is my

client-side code:

        $scope.dtOptions = DTOptionsBuilder.newOptions()
            .withPaginationType('full_numbers')
            .withOption('ajax', {
                serverSide: true,
                processing: true,
                url: '/choicelist/list',                                            // chocielist is a restful service - express, mysql 
                type: 'POST',
                data: function(d, settings){
                    var api = new $.fn.dataTable.Api(settings);
                    api.ajax.url(
                        '/choicelist/list'
                    );
                    return JSON.stringify(d);
                }
            })
            // .withDataProp('data')
            .withDataProp(function(json){
                console.log(" ajax > post > success > response > ", json);
                return json.list;
            })

            .withOption('language',{
                paginate : {            // Set up pagination text
                    first: "«",
                    last: "»",
                    next: "→",
                    previous: "←"
                },

              lengthMenu: "_MENU_ records per page"                         
            })

            .withColReorder()                                                 
            .withColReorderOption('iFixedColumnsRight', 1)  
            .withColVis()                                                    
            .withColVisOption('aiExclude', [13])                 
            .withColVisOption('buttonText', '<i class="fa fa-cog fa-fw">')  
            .withColVisOption('activate','mouseover')                         
            .withColVisOption( 'label',function ( index, title, th ) {       
                    return (index+1) +'. '+ title;
              })
            .withDOM('<"row tablealign" <"col-sm-2 col-xs-8 col-xs-offset-4 col-sm-offset-1" l><"col-sm-2  col-xs-5" T><"col-sm-3  col-xs-7" f><"col-sm-1  col-xs-1" C><"col-sm-3  col-xs-8" p>>t<"F"i>')
            .withColVisOption( 'align', 'left')                                
            .withTableTools('vendor/datatables/datatables-tabletools/swf/copy_csv_xls_pdf.swf') //for copy, print, xls, pdf, csv
            .withTableToolsButtons([{                                        
                'sExtends': 'print',
                'sButtonText': '<i class="tabletoolicon fa fa-print"> '
                },{
                    'sExtends': 'copy',
                    'sButtonText': '<i class="tabletoolicon fa fa-copy"> '
                },{
                    'sExtends': 'collection',
                    'sButtonText': '<i class="glyphicon glyphicon-save">',
                    'aButtons': [{
                        'sExtends': 'csv',
                        'sButtonText': '<i class="tabletoolicon fa fa-file-excel-o"> csv',
                        'oSelectorOpts': {
                            filter: 'applied'
                        },
                    'sCsvMessage': 'Client List'
                }, {
                    'sExtends': 'xls',
                    'sButtonText': '<i class="tabletoolicon fa fa-file-excel-o"> xls',
                    'oSelectorOpts': {
                        filter: 'applied'
                },
                    'sXlsMessage': 'Client List'
                }, {
                    'sExtends': 'pdf',
                    'sButtonText': '<i class="tabletoolicon fa fa-file-pdf-o"> pdf',
                    'oSelectorOpts': {
                        filter: 'applied'
                    },
                    'sPdfMessage': 'Client List'
                }]
            }])
            .withColumnFilter({                             //column wise filter
                sPlaceHolder : 'head:before',
                aoColumns: [
                   {type: 'number'}, 
                   {type: 'text', bRegex: true, bSmart: true}, 
                   {type: 'text', bRegex: true, bSmart: true}, 
                   {type: 'text', bRegex: true, bSmart: true}, 
                   {type: 'text', bRegex: true, bSmart: true}, 
                   {type: 'text', bRegex: true, bSmart: true}, 
                   {type: 'text', bRegex: true, bSmart: true}, 
                   {type: 'text', bRegex: true, bSmart: true}, 
                   {type: 'text', bRegex: true, bSmart: true}, 
                   {type: 'text', bRegex: true, bSmart: true}, 
                   {type: 'text', bRegex: true, bSmart: true}, 
                   {type: 'text', bRegex: true, bSmart: true}, 
                   {type: 'text', bRegex: true, bSmart: true}
               ]
            })
            .withBootstrap()             
            .withBootstrapOptions({
                TableTools: {
                    classes: {
                        container: 'btn-group',
                    }
                },
                ColVis: {
                    classes: {
                        masterButton: 'btn btn-success'
                    }
                },
                pagination: {
                    classes: {
                        ul: 'pagination pagination-sm'
                    }
                }
            });

            $scope.dtColumnDefs = [
                DTColumnDefBuilder.newColumnDef(13).notSortable()
            ];

I have these following issues to which I am seeking help in this forum:

1. With above code, I receive an error on browser console
   **"Uncaught TypeError: Cannot read property 'length' of undefined"***

   On console logging, I see the returned value from backed (via withDataProp(sAjaxDataProp)) which contains data from
   MySQL table

   ajax > post > success > response > Object {aData: Array[10]} aData: Array[10]0: Object1: Object2: Object3: Object4: Object5:
   Object6: Object7: Object8: Object9: Objectlength: 10__proto__: Array[0]proto: Object

   However, I receive the error "Uncaught TypeError: Cannot read property 'length' of undefined"

2. I server-side (express-js), I would want to use the client-side sent parameters for sorting, pagination, searching - I am unable to get these parameters.

Request someone to help correct me (if possible examples), if I am on correct track to achieve my goal - to implement full server-side datatable functionality.

Thanks in anticipation.

viju

Here is the link to datatables debug http://debug.datatables.net/ucinak