CODEWITHSUNDEEP
javascriptjquerydatatables
Bilbo Baggins
Bilbo Baggins

Reputation: 3019

jQuery datatable, adata is undefined

I want to implement JQuery datatable in my application, I have tried following things.

My HTML:

<div id="tableDiv" class="col-md-12">
    <table id="userTable" class="display">
        <thead>
            <tr>
                <th>Username</th>
                <th>Name</th>
                <th>Surname</th>
                <th>Status</th>
                <th>Email</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>username</td>
                <td>name</td>
                <td>surname</td>
                <td>status</td>
                <td>email</td>
            </tr>
        </tbody>
    </table>
</div>

My Javascript:

$(document).ready(function() {
    $('#userTable').DataTable( {
        "ajax": {
            "dataType": 'json',
            "contentType": "application/json; charset=utf-8",
            "type": "GET",
            "url":"/myApp/user/getAll"
        },
        "sAjaxSource": "/myApp/user/getAll",
        "sAjaxDataProp": "data.users",
        "columns": [
                    { "data": "username" },
                    { "data": "name" },
                    { "data": "surname" },
                    { "data": "status" },
                    { "data": "emailAddress" }
                  ]
    } );
} );

I added 

 "sAjaxSource": "/myApp/user/getAll",
 "sAjaxDataProp": "data.users",

above to remove the adata is undefined error, I am pretty much stuck here. I am not able to figure a way to solve this.

Following is the JSON response I am getting form the server.

{
  "users": [
    {
      "userId": "1",
      "username": "admin",
      "name": "Ak",
      "surname": "AK_D",
      "status": true,
      "emailAddress": "[email protected]",
      "enabled": true,
      "accountNonLocked": true,
      "accountNonExpired": true,
      "credentialsNonExpired": true
    }
  ]
}

P.S I am a novice in JQuery, JavaScript (that is the reason to learn it I am implementing this in my app).

Upvotes: 0

Views: 837

Answers (1)

Siwakorn Petchuchuay
Siwakorn Petchuchuay

Reputation: 176

Can you try changing "sAjaxDataProp": "data.users" to "sAjaxDataProp": "users" ?

Upvotes: 1

Related Questions