how to populate jquery datatables with json?

Question

I am using jquery datatable in my application, plugin link https://datatables.net/

I want to populate my datatable with JSON, but I am failed.here is my code.

HTML:

<table id="example" class="display" width="100%" cellspacing="0">
                            <thead>
                            <tr>
                                <th>id</th>
                                <th>Name</th>
                                <th>Code</th>
                                <th>Description</th>
                                <th>isActive</th>
                            </tr>
                            </thead>
                            <tfoot>
                            <tr>
                                <th>id</th>
                                <th>Name</th>
                                <th>Code</th>
                                <th>Description</th>
                                <th>isActive</th>
                            </tr>
                            </tfoot>
                            <tbody>
                            </tbody>
                        </table>

JS:

$(document).ready(function() {
    console.log("hi ready");
    $('#example').DataTable({

        retrieve: true,
        ajax: {

            url: '/ProductLicensingApplication/feature/list',
            dataSrc: ''
        },

        "columns": [
            { "data": "id" },
            { "data": "name" },
            { "data": "code" },
            { "data": "description" },
            { "data": "isActive" }
        ]
    });
} );

my json

but I am not able to populate data into the table as the table shows no data available in the table..you can see in the image

please tell me what is the problem in my code...

Answer 1

Ahmad,

Either set dataSrc : 'features' or if possible rename the attribute name 'features' to 'data' in the response data.

Answer 2

As written in documentation. The ajax.dataSrc option is used to tell DataTables where the data array is in the JSON structure. An empty string is a special case which tells DataTables to expect an array.

In your case JSON is an object and you should set dataSrc : 'features'