Using server side processing with an array of objects as data source results in an empty table

Using server side processing with an array of objects as data source results in an empty table

subsurfsubsurf Posts: 4Questions: 1Answers: 0

I was trying to create a datatable (most recent datatables version) which uses server side processing.
So far the data is queried via AJAX, the server responds with a JSON response containing an array of objects like this:

[{ Id: 123, Name: 'First object'}, { Id: 321, Name: 'Second object' }]

and my columns definition looks like the following

// ...
columns: [
    { title: 'Id', data: 'Id' },
    { title: 'Name', data: 'Name' }
]
// ...

The ajax configuration of the datatable looks like so

// ...
ajax: {
    url: 'my/rest/api/object',
    dataSrc: ''
}
// ...

This works without problem. However, if I enable server side processing (and adjust the server response accordingly), I always get an empty table. I didn't change anything about my datatables config except for server side processing.
My new server response looks like the following

{
    draw: 1, // depending on the given draw parameter
    recordsTotal: 2,
    recordsFiltered: 2,
    data: [{ Id: 123, Name: 'First object'}, { Id: 321, Name: 'Second object' }]
}

The response seems to be processable by datatables because the footer shows the correct values for total number of records etc., the only problem is that the table stays empty, displaying the "no data available" message, even though the data member of my response is populated.

I also removed the dataSrc attribute because I thought maybe it has to be on default for it to work, but that gives me an exception in the Javascript console:
TypeError: data is undefined on line 1211 in jquery.datatables.js

So I guess dataSrc: '' is correct. I am a little stuck now, how could I fix this?

This discussion has been closed.