Two vue datatables in one page with ajax load

mshah

I'm trying to load two Vue datatables in Vue page with Ajax, and only one ever seems to ever load the data. Any suggestions how two can exist/load/function?

Example code: https://vue-svvzff.stackblitz.io

mshah

Also, the second table call to grab Ajax data gives a:
Failed to load resource: the server responded with a status of 504 (Gateway Timeout)

kthorngren

That is a communications issue not related to Datatables. Try the ajax url you have defined in the web browser and you will likely get the same error. Verify the url is correct.

Start by looking at the server logs to see if the request is seen. If seen then the logs may help diagnose why the server isn’t responding. If not seen then there is an IP connectivity issue.

Kevin

mshah

When I remove one Datatable, the other one works, and vice versa, so I'm not sure why that would work but throw a 504 on one and not the other if both are there?

kthorngren

Maybe a timing issue with the server?? Possibly the server is processing the first request when the second is received and doesn't process the second.

Again Datatables is simply sending the request. The 504 response is from the remote end and not controlled by Datatables. You won't be able to troubleshoot the problem from the client side. You can use the browser's network inspector to see if there are any differences between the non-working with two Datatables or the working with one of each. I would start with the server logs to see if it gets the request and has errors or simply doesn't process the request.

See this explanation:
https://developer.mozilla.org/en-US/docs/Web/HTTP/Status/504

I tried your test case but it keeps spinning with a message stating its trying to connect to the server.

Kevin