Datatable not loaded / Restful node

osanmartin

Hi, i have json response from my api, and i validate it in jsonlint, but datatable always return TypeError: undefined is not an object (evaluating 'data.length'). Here how i load datatable:

mTable = $('#tmesa').DataTable( {
                'sDom': 'T<"clear">lfrtip',
                'bSort': false,
                'bFilter': false, 
                'language': {
                            select: {
                                        rows: " "
                                    },
                            "infoEmpty": "No hay mesas para local",
                            "emptyTable": " ",
                            "loadingRecords": '&nbsp;',
                            "processing": ' ',
                            "info": "Total filas: ",
                            "infoFiltered": ""
                        },
                'scrollY': "325px",
                'fnRowCallback': function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
                                  },
                'processing': true,
                'paging': false,
                'serverSide': true,   
                'ajax': {
                         "url" : "https://168.14.1.42:8443/descenariom/08204",
                         "type": "GET",
                         "data":  function ( d ) {
                                    return $.extend( {}, d, {
                                        "id" : codigoLocal
                                  })
                            }
                        },
                'columns': [ 
                            { data : "glosamesafusionada" },
                            { data : "destino_fecha" },
                            { data : "destino_digita_fecha" }
                        ],
                'bAutoWidth': false,
                'responsive': true,                                
                'aoColumns' : [
                            { sWidth: '33%' },
                            { sWidth: '33%' },
                            { sWidth: '33%' }
                            ],
                'columnDefs':[                       
                        { targets: [0, 1], className: 'dt-body-left' },
                        { targets: [2], className: 'dt-body-center' }
                    ],
                'drawCallback': function( settings ) {
                        console.log('listo...');
                    }
            });

Thanks!!!!

Edited by Kevin:  Syntax highlighting. Details on how to highlight code using markdown can be found in this guide

kthorngren

Its hard to say without seeing the Ajax response from the browser's developer tools.

You have columns and aoColumns definitions. aoColumns is the legacy (DT 1.9) form of the option. The conversion guide provides more details. I'm not sure if the aoColumns will overwrite the column definition but you should combine them like this:

                'columns': [
                            { data : "glosamesafusionada", width: '33% },
                            { data : "destino_fecha", width: '33% },
                            { data : "destino_digita_fecha", width: '33% }
                        ],

If aoColumns overwrites the columns then making the above change might resolve the problem.

The best option is to provide a link to your page so we can take a look to help debug.

Kevin

osanmartin

This is de Ajax response, validate in jsonlint:

[{"glosamesafusionada":"1M-131","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"2M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"3M","destino_fecha":null,"destino_digita_fecha":null},{"glosamesafusionada":"4M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"5M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"6M","destino_fecha":null,"destino_digita_fecha":null},{"glosamesafusionada":"7M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"8M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"9M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"10M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"11M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"12M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"13M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"14M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"15M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"16M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"17M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"18M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"19M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"20M","destino_fecha":null,"destino_digita_fecha":null},{"glosamesafusionada":"21M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"22M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"23M","destino_fecha":null,"destino_digita_fecha":null},{"glosamesafusionada":"24M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"}]

osanmartin

Hi, thanks, but ajax response is valid:

[{"glosamesafusionada":"1M-131","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"2M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"3M","destino_fecha":null,"destino_digita_fecha":null},{"glosamesafusionada":"4M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"5M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"6M","destino_fecha":null,"destino_digita_fecha":null},{"glosamesafusionada":"7M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"8M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"9M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"10M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"11M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"12M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"13M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"14M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"15M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"16M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"17M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"18M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"19M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"20M","destino_fecha":null,"destino_digita_fecha":null},{"glosamesafusionada":"21M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"22M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"},{"glosamesafusionada":"23M","destino_fecha":null,"destino_digita_fecha":null},{"glosamesafusionada":"24M","destino_fecha":"2017-12-15T03:00:00.000Z","destino_digita_fecha":"2017-12-15T20:10:53.000Z"}]

colin

Did you make the change Kevin suggested? Can you link to your page, please.

Colin

kthorngren

The response may be a valid JSON string but it also needs to be a format that Datatables supports. This page discusses the supported JSON data from Ajax:
https://datatables.net/manual/ajax

The key is that it expects the data to be in a data object by default. That is not the case for you. This [section] of that doc explains how to handle this with ajax.dataSrc. The first example is what you want.

In addition you have 'serverSide': true, enabled. This adds to the requirements as documented here:
https://datatables.net/manual/server-side

Do you need server side processing enabled? See this FAQ to help decide. Its best not to use it unless you need to.

Kevin