TypeError: data is undefined when using jquery.datatables.min.js

Question

"I am able to see the server side ajax results, but I am receiving a JS error on screen.

There are no null values in the result.

But, the below mentioned error is thrown.

DataTables warning: table id=summaryResults1 - Requested unknown parameter 'workCategory' for row 0, column 0. For more information about this error, please see http://datatables.net/tn/4"

summaryTable = $('#summaryResults1').DataTable( {

                              data: tableResultsAjax,
                              serverSide: true,
                              ajax: {
                                    dataSrc: function (json) {
                                          return json.data;
                                      },
                                    "data": function(){
                                        var info = $('#summaryResults1').DataTable().page.info();

                                         $('#summaryResults1').DataTable().ajax.url(
                                                url_ajax+"&bucketCounter="+(info.page+1)
                                            );

                                    }

                              },

                              paging:true,
                              pageLength:500,
                              scrollX:true,
                              scrollCollapse: true,
                              ordering: false,
                              "scrollY": 1000,
                              "lengthChange": false,
                              "searching": false,
                              "deferRender":true,

                   "columns": [
                              { "data": "workCategory" },
                              { "data": "queue" },
                              ....

                              ],

                        columnDefs : [ {
                                "targets" : [  10, 11, 12, 13, 14, 15, 16, 17, 18, 19 ],
                                "render" : function(data, type, row,meta) {
                                    if (type === "display" ) {
                                        param = 20-meta.col;
                                        return drilldownViewCheck?data:"<a id = 'aa' href=\"javascript:passAJAXValues('" + row.queue.code + "','" + row.task.code + "','P"+param+"','"+ row.office.code + "')\"style=\"color:#FFF;\">" + data + "</a>";
                                    }
                                }
                            },

                            ....
                          ],

                        fixedColumns:{
                              leftColumns:6
                          }





                      } );
 });

The server side response for one row is

{"recordsFiltered":750,"data":"[{....,\"workCategory\":\"Work category\",....,\"queue\":\"Queue Name\"}]","draw":2,"recordsTotal":750}

Gyrocode.com · Accepted Answer · 2018-10-22 13:29:17Z

1

Technical note #4 states the problem precisely:

This will indicate that a column which uses columns.data has been unable to obtain valid data to display - for example:
{ data: 'Name' }
would produce this error if the data source object for the row had no Name parameter or the data was null or undefined.

Your response from the server-side script most likely do not have workCategory property.

In your response your data property is encoded into JSON format twice on the server, that is why DataTables is not finding any data, because data is a string and should be array.

edited Oct 22, 2018 at 13:29

answered Oct 22, 2018 at 11:40

Gyrocode.com

59k16 gold badges157 silver badges192 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

shashi Over a year ago

I have checked the server side script already in the Network(Developer tools). All the fields that are mentioned are present.

Gyrocode.com Over a year ago

@sashi, please post response from your server-side script

shashi Over a year ago

Edited the post. You can find the server side response there.

shashi Over a year ago

I have removed the dataSrc and tested. No luck!

Gyrocode.com Over a year ago

@shashi, your data is encoded into JSON format twice on the server, that is why DataTables is not finding any data, because data is a string and should be Array.

|

Collectives™ on Stack Overflow

TypeError: data is undefined when using jquery.datatables.min.js

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related