Uncaught TypeError: Can not read property 'length' of undefined [json, ajax and DataTables]

2

I can not show the data in my table.

With the following index I send the data of my table by json:

public function index(Request $request)
    {
    if ($request->ajax()) {
        $modelos = Modelos::all();
        return response()->json($modelos);
    }
    return view('modelos.index');
}

Then in my view when I try to show:

    $(document).ready(function() {
        $('#mytable').DataTable( {
            "ajax": "/modelo",
            "columns": [
                { "data": "marca" },
                { "data": "modelo" },
                { "data": "part_number" },
                { "data": "coste" },
                { "data": "caracteristicas" },
            ]
        } );

 <body>
<a href="{!!URL::to('/modelo/create')!!}" class="create">Nuevo</a>
<table id="mytable" class="display" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>Marca</th>
            <th>Modelo</th>
            <th>Part Number</th>
            <th>Coste</th>
            <th>Características</th>
        </tr>
    </thead>

    <tfoot>
        <tr>
            <th>Marca</th>
            <th>Modelo</th>
            <th>Part Number</th>
            <th>Coste</th>
            <th>Características</th>
        </tr>
    </tfoot>
</table>

But I get the error in the console:

  

Uncaught TypeError: Can not read property 'length' of undefined

The json received is as follows:

[{"id":1,"marca":"HP","modelo":"EliteBook 840","part_number":"44G57TH","coste":1,"caracteristicas":"4GB RAM 256GB SSD","created_at":"2017-04-16 14:36:58","updated_at":"2017-04-16 14:36:58"}]

If I pass a manually created ajax like the following one, I have no problem and it shows me perfectly the data in my table:

{
"data": [
{
    "marca": "Prueba",
    "modelo": "modelo",
    "part_number": "12354",
    "coste": "0",
    "caracteristicas": "Nose"
}]

}

The only difference I see is that the previous one does not include "data:" and this one does, but I do not know how to pass it in the same way.

Thanks in advance.

    
asked by Sergio Ramirez Dominguez 27.04.2017 в 23:22
source

1 answer

1

I found the solution in another question in this forum: solution . Affecting my code as follows:

$(document).ready(function() {
        $('#mytable').DataTable( {
            "ajax": {
                "url": "/modelo",
                "dataSrc": ""
                },
            "columns": [
                { "data": "marca" },
                { "data": "modelo" },
                { "data": "part_number" },
                { "data": "coste" },
                { "data": "caracteristicas" },
                {{--{ "data": "salary" }--}}
            ]
        } );

I hope it helps you. Thanks!

    
answered by 27.04.2017 в 23:36