How can I implement server-side processing to my datatables using a json file?

Question

This is my datatable that works with a json file:

var table = $('.table').DataTable({
     "lengthMenu": [[10, 25, 50,100, -1], [10, 25, 50,100, "All"]],
     "pageLength": 10,
     "data":{{ output.data|raw }},

It works well like this.

To get the datatable faster I added this lines:

var table = $('.table').DataTable({
     "serverSide": true,
     "lengthMenu": [[10, 25, 50,100, -1], [10, 25, 50,100, "All"]],
     "pageLength": 10,
     "data":{{ output.data|raw }},
     "processing": true,

Now I get the error

DataTables warning: table id=DataTables_Table_0 - Invalid JSON response

The json comes directly from a json file with data.

If you set serverSide: true then you should not use data. Provide the URL to the JSON file in the ajax property. See the documentation — Rory McCrossan
– Rory McCrossan, Commented Feb 5, 2020 at 16:55
@RoryMcCrossan I removed data and added ajax with the correct link to the json file, but it is no datatable is loaded now :( — peace_love
– peace_love, Commented Feb 5, 2020 at 17:20

Community · Accepted Answer · 2020-06-20 09:12:55Z

1

The documentation on the serverSide option explains:

DataTables has two fundamental modes of operation:

Client-side processing - where filtering, paging and sorting calculations are all performed in the web-browser.

Server-side processing - where filtering, paging and sorting calculations are all performed by a server.

serverSide: true means that the raw data, as a whole, does not exist on the client. The client only holds sorted and paginated views of the data that are sent from an HTTP endpoint made to communicate those pages to a client.

If you send all the data to the client, you probably don't intend to use server-side processing.

If your problem is that sorting and paginating the data is too slow (because your data consists of many hundreds or thousands of records), then you probably do want switch to server-side processing. The first step is to stop specifying a data option and instead use an ajax option with a target URL. Then you need to write a server-side endpoint at the URL that performs the necessary transformations when requested. See the DataTables example documentation on server side processing to get started.

edited Jun 20, 2020 at 9:12

CommunityBot

11 silver badge

answered Feb 5, 2020 at 17:06

apsillers

116k18 gold badges248 silver badges249 bronze badges

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

3 Comments

peace_love Over a year ago

you mean when I use this "serverSide": true, "ajax": "data.json",it should work

apsillers Over a year ago

@peace_love If data.json is a server-side endpoint that is prepared to alter its responses based on the parameters sent to it, then yes. Otherwise, no. When you say ajax": "data.json" you are telling the DataTables client to send a request like data.json?start=10&length=5&... and expects back a response like {"draw":4,"recordsTotal":57,"recordsFiltered":57,"data":[ ... ]} where the data field is a rendered, trimmed and sorted view of your data on the server. Have you written server-side code to do data processing? If not, you do not intend to use DataTable's server-side processing.

peace_love Over a year ago

Ah, now I understand, very good explaination. my data.json starts like this: [{"id":536,"name":"Alfred",... So I have to add the format into the file right? and than it should work?

Collectives™ on Stack Overflow

How can I implement server-side processing to my datatables using a json file?

1 Answer 1

3 Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Related