Laravel-datatables: ERROR: DataTables warning: table id=DataTables_Table_0 - Ajax error. For more information about this error, please see http://datatables.net/tn/7

Created on 19 Dec 2018  Â·  2Comments  Â·  Source: yajra/laravel-datatables

Hello,

I am trying to use datatables package on my laravel 5.7 project and I am facing the following problem:

DataTables warning: table id=DataTables_Table_0 - Ajax error. For more information about this error, please see http://datatables.net/tn/7

And when I open developer network tab I get a 404 errror message. When I click on it and then click on response tab to get more details, I get the following error message.

{
"message": "No query results for model [App\Account].",
"exception": "Symfony\Component\HttpKernel\Exception\NotFoundHttpException",
"file": "/home/developer/PROJECTS/Invoicing/vendor/laravel/framework/src/Illuminate/Foundation/Exceptions/Handler.php",
"line": 200,
"trace": [
{
"file": "/home/developer/PROJECTS/Invoicing/vendor/laravel/framework/src/Illuminate/Foundation/Exceptions/Handler.php",
"line": 176,
"function": "prepareException",
"class": "Illuminate\Foundation\Exceptions\Handler",
"type": "->"
},
...
]
}

Code snippet of problem

Here are the lines of code on my view

<table class="table datatable dataTable table-bordered ">
    <thead>
        <tr>
            <th>Id</th>
            <th>Account Name</th>
            <th>Billing Name</th>
            <th>Organisation</th>
            <th>Address</th>
            <th>Email</th>
            <th>Phone</th>
             <th>Expiration Date</th>
             <th>Creation Date</th>
             <th>Last Update</th></th>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>
<script>
         $(document).ready(function() {
                    $('.datatable').DataTable({
                           processing: true,
                           serverSide: true,
                           ajax: "{{ route('accounts.all') }}"
                    });
        });
</script>

Here is what I have on my route

Route::get('accounts/all', ['as'=>'accounts.all', 'uses'=>'AccountController@getAll']);

And here is what I have on my controller

 public function getAll()
    {
        return Datatables::of(Account::all())->make();
    }

and when I try to dd(Datatables::of(Account::all())->make()) function before returning to the view I get the following results

JsonResponse {#246 â–¼
  #data: "{"draw":0,"recordsTotal":2,"recordsFiltered":2,"data":[{"id":"1","ac":"kwathu.co.mw","name":"Daniel Justin","organisation":"Malawi SDNP","address":"P. O. Box 31 â–¶"
  #callback: null
  #encodingOptions: 0
  +headers: ResponseHeaderBag {#241 â–¶}
  #content: "{"draw":0,"recordsTotal":2,"recordsFiltered":2,"data":[{"id":"1","ac":"kwathu.co.mw","name":"Daniel Justin","organisation":"Malawi SDNP","address":"P. O. Box 31 â–¶"
  #version: "1.0"
  #statusCode: 200
  #statusText: "OK"
  #charset: null
  +original: array:6 [â–¶]
  +exception: null
}

which is a JsonResponse containing the desired results I want to be on my table.

I Have tried to go through different discussions but I am failing to come up with a solution to this problem. Please, help me to solve this problem.

System details

  • Operating System Fedora 29
  • PHP Version 7.2.12
  • Laravel Version 5.7
  • Laravel-Datatables 8.13

Most helpful comment

You have to define columns in AJAX call based on the JSON data that you receive:
```javascript

$(document).ready(function() {
$('.datatable').DataTable({
processing: true,
serverSide: true,
ajax: "{{ route('accounts.all') }}",
columns: [
{ data: 'ID', name: 'ID' },
{ data: 'accountname', name: 'accountname' },
{ data: 'billingname', name: 'billingname' },
{ data: 'organisation', name: 'organisation' },
{ data: 'address', name: 'address' },
{ data: 'email', name: 'email' },
{ data: 'phone', name: 'phone' },
{ data: 'expdate', name: 'expdate' },
{ data: 'createdate', name: 'createdate' },
{ data: 'lastupdate', name: 'lastupdate',}
]
});
});
`

All 2 comments

You have to define columns in AJAX call based on the JSON data that you receive:
```javascript

$(document).ready(function() {
$('.datatable').DataTable({
processing: true,
serverSide: true,
ajax: "{{ route('accounts.all') }}",
columns: [
{ data: 'ID', name: 'ID' },
{ data: 'accountname', name: 'accountname' },
{ data: 'billingname', name: 'billingname' },
{ data: 'organisation', name: 'organisation' },
{ data: 'address', name: 'address' },
{ data: 'email', name: 'email' },
{ data: 'phone', name: 'phone' },
{ data: 'expdate', name: 'expdate' },
{ data: 'createdate', name: 'createdate' },
{ data: 'lastupdate', name: 'lastupdate',}
]
});
});
`

i have a large data in my database and when i use datatabe then i give this error!

Was this page helpful?
0 / 5 - 0 ratings

Related issues

ezani92 picture ezani92  Â·  33Comments

faisalhilmi picture faisalhilmi  Â·  18Comments

ZAZmaster picture ZAZmaster  Â·  15Comments

jay-shah-rushiinfotech picture jay-shah-rushiinfotech  Â·  19Comments

mithleshjs picture mithleshjs  Â·  16Comments