Server-side processing not seeding my table

j.castelli

Hello everyone,

I'm trying to work with server-side processing but even if I my AJAX call does send back what seems to be properly formatted data, my table is still empty and I can't understand why.

Here's my Javascript: https://sourceb.in/2hCPlWIy4I
Here's my PHP: https://sourceb.in/9pILvEveci
Attached is a screenshot of what my AJAX call sends back.

A few more info:
- This is a local development so I am sorry, I'm not able to share a test case.
- I'm working with Laravel 8 and the Yajra plugin for Laravel.
- There's no error message in the console
- There's no error in the console debugger but when I click on "table information", there's this error in the console: "Uncaught TypeError: tables is undefined", which I don't really understand.

Can anyone see what I've missed?

kthorngren

The JSON data looks ok. What does your columns definition look like, ie, what is columnsData['columns'] for the option columns: columnsData['columns'],?

There's no error in the console debugger but when I click on "table information", there's this error in the console: "Uncaught TypeError: tables is undefined", which I don't really understand.

Not sure what "table information" is but it sounds like a function is running that is referencing the variable table which is undefined. I don't see anything using table in the JS code you posted.

I don't see anything else that might be a problem. Looks like the Processing message stays which indicates to me that there is a Javascript error stopping Javascript processing.

Kevin

j.castelli

Thanks for your feedback Kevin!

Here's what columnsData['columns'] is:

0: {data: 'environment', name: 'environment', mData: 'environment', sName: 'environment'}
1: {data: 'client_display_name', name: 'client_display_name', mData: 'client_display_name', sName: 'client_display_name'}
2: {data: 'country', name: 'country', mData: 'country', sName: 'country'}
3: {data: 'client_id', name: 'client_id', mData: 'client_id', sName: 'client_id'}
4: {data: 'token', name: 'token', mData: 'token', sName: 'token'}
5: {data: 'webshop', name: 'webshop', mData: 'webshop', sName: 'webshop'}
6: {data: 'products', name: 'products', mData: 'products', sName: 'products'}
7: {data: 'total_products', name: 'total_products', mData: 'total_products', sName: 'total_products'}
8: {data: 'last_checked', name: 'last_checked', mData: 'last_checked', sName: 'last_checked'}
9: {data: 'updated_at', name: 'updated_at', mData: 'updated_at', sName: 'updated_at'}
10: {data: 'error', name: 'error', mData: 'error', sName: 'error'}
11: {data: 'error_date', name: 'error_date', mData: 'error_date', sName: 'error_date'}

I think this is okay as there's no problem with a "normal" datatables (meaning without server-side processing).

Regarding the debugger, I meant the first line here in the picture attached but indeed I do not have anything called table in my own script.

kthorngren

One problem is you are using columns.data which is expecting each row to be an object. But your rows are arrays. Either remove the columns.data from each column or change the JSON response to object data structure. See the data docs for more info.

Also the sName and mData options are legacy naming convention and are the same as column.name and column.data. You can remove sName and mData.

I think this is okay as there's no problem with a "normal" datatables (meaning without server-side processing).

Are you saying that removing "serverSide": true, from this table it works?

Kevin

kthorngren

Just realized that your JSON response is incorrect:

The draw: 0 is wrong. The 'draw' parameter is a sequence number. When Datatables initializes the first requests sends draw: 1 and expects to see 1 in the response. draw: 0 is never sent. Look at the Request tab of the browser's network inspector to see what is sent. See the Server Side Processing docs for more details. Sounds like you will need to investigate the Yajra plugin for this.

Kevin

j.castelli

Thanks a bunch, the problem was indeed related to draw: 0. I switched to a POST request for the ajax call and now I do have draw: 1. However, my filters are now doing whatever they like, which is not what I like!

Do you have any idea why, by any chance?

kthorngren

I'm guessing you are referring to the SearchPanes and SearchBuilder extensions you have configured?

These extensions build the search data based one the data in the client. Since you have server side processing enabled that data is limited to the page being shown. Both have the capability to work with Server Sid eProcessing but your server script needs to support each extension's protocol. See these links:

https://datatables.net/extensions/searchpanes/serverside
https://datatables.net/extensions/searchbuilder/serverside

I suspect the Yajra library doesn't have this support. You will need to work with the Yarja developers or update the library for tis support.

An alternative is to disable server side processing. Looks like you have less than 4000 rows. Do you need server side processing?

Kevin

j.castelli

Thanks again Kevin, it was indeed what I was looking for. I eventually changed my position and had to go with ajax sourced data instead.

Thanks again for your support!