How can I use JSON 2d array with datatable

nutchyleo

This is my JSON that return form API

{
  "status": "sample string 1",
  "message": "sample string 2",
  "examScheduleInterviews": [
    {
      "examScheduleId": 1,
      "examStartDate": "sample string 2",
      "examEndDate": "sample string 3",
      "examStartTime": "sample string 4",
      "examEndTime": "sample string 5",
      "examinerId": 6,
      "positionId": 7,
      "positionGroupId": 8,
      "positionLine": 9,
      "examineeInterviews": [
        {
          "examineeId": 1,
          "userId": 2,
          "employeeId": 3,
          "employeeName": "sample string 4",
          "employeeSurname": "sample string 5",
          "employeeEmail": "sample string 6",
          "employeeTitle": "sample string 7"
        },
        {
          "examineeId": 1,
          "userId": 2,
          "employeeId": 3,
          "employeeName": "sample string 4",
          "employeeSurname": "sample string 5",
          "employeeEmail": "sample string 6",
          "employeeTitle": "sample string 7"
        }
      ]
    },
    {
      "examScheduleId": 1,
      "examStartDate": "sample string 2",
      "examEndDate": "sample string 3",
      "examStartTime": "sample string 4",
      "examEndTime": "sample string 5",
      "examinerId": 6,
      "positionId": 7,
      "positionGroupId": 8,
      "positionLine": 9,
      "examineeInterviews": [
        {
          "examineeId": 1,
          "userId": 2,
          "employeeId": 3,
          "employeeName": "sample string 4",
          "employeeSurname": "sample string 5",
          "employeeEmail": "sample string 6",
          "employeeTitle": "sample string 7"
        },
        {
          "examineeId": 1,
          "userId": 2,
          "employeeId": 3,
          "employeeName": "sample string 4",
          "employeeSurname": "sample string 5",
          "employeeEmail": "sample string 6",
          "employeeTitle": "sample string 7"
        }
      ]
    }
  ]
}

and this is my code in jquery for use datatable on that JSON Data

           var res = jsondata

            $('#AvailableTB').DataTable({
                'destroy': true,
                'data': res.examScheduleInterviews,
                'columns': [
                    {
                        "data": null,
                        "sortable": false,
                        "render": function (data, type, row) {
                            return '<a class="btn btn-info btn-sm" style="padding: 1px 5px 1px 5px;" href=#/' + row[0] + '>' + 'select' ++'</a>';
                        }
                    },
                    { "data": "examStartDate" }, 
                    { "data": "examStartTime" },
                    { "data": "examEndDate" },
                    { "data": "examEndTime" },
                    { "data": "examineeInterviews[0].employeeName"},
                    { "data": "positionName" },
                    { "data": "positionGroupName" },
                    { "data": "positionLineName" },
                ],
                'autoWidth': false,
                'pageLength': 10,
                'scrollY': '50vh',
                'scrollX': true,
                'responsive': false,
                'ordering': false,
                'searching': true,
                'bLengthChange': false,
                'language': {
                    'emptyTable': "Not have data."
                }
            });

but after I run a code it will return "employeeName" in the fifth column as "10203" in one row
(https://datatables.net/forums/uploads/editor/zr/j14wz8y3pqpu.png )

but what I expect is 3 rows with separate "employeeName"
(look like this
https://datatables.net/forums/uploads/editor/o2/6z46mzelwijz.png
)

nutchyleo

this is fiddle for this issue https://jsfiddle.net/nutchyleo/yjfq6580/5/

What I expect in that fiddle need to have 4 rows of data.

colin

Hi @nutchyleo ,

You just need

{ "data": "examineeInterviews[].employeeName" },

See you modified fiddle here.

Cheers,

Colin