I want show array of objects inside an array of objects.

GhaLzai

This Is i am trying append to my datatable column.

columns: [         
       { data: [data:'children.name']},
      ],

My json response looks like this.

"doc": {
        "createdDate": "2022-05-28T15:38:27.043Z",
        "enabled": true,
        "_id": "6292a5756774d60c13b473a0",
        "CNIC": "936123f9bc287e62af987261d2586c3f",
        "employeeID": "UP81561",
        "fName": "Test Employee",
        "company": "6249ff221399dc7a14173dd1",
        "fatherName": "Rob",
        "motherName": "Sasha",
        "spouse": "Mary",
        "children": [
            {
                "_id": "6292a5756774d60c13b473a1",
                "name": "Pete",
                "age": 5
            },
            {
                "_id": "6292a5756774d60c13b473a2",
                "name": "Pete",
                "age": 5
            },
            {
                "_id": "6292a5756774d60c13b473a3",
                "name": "Pete",
                "age": 5
            },
            {
                "_id": "6292a5756774d60c13b473a4",
                "name": "Pete",
                "age": 5
            }
        ],
        "__v": 0
    }

its not appending data into this.
Mai main array is "doc" and inside that main array I have 'children"array of objects.

Edited by Kevin: Syntax highlighting. Details on how to highlight code using markdown can be found in this guide

GhaLzai

@kevin how can i loop through this data?

kthorngren

Sounds like you need to use ajax.dataSrc to point Datatables to your row data. Something like this:

ajax: {
  url: 'my_url',
  dataSrc: 'children'
}

Then just set columns.data like this:

columns: [
  { data: 'name'},
]

Kevin

GhaLzai

@kevin I have updated m code. kindly check the Children array is already in "doc" array So I have to access childrent object which further has array of objects.

kthorngren

Just update the ajax.dataSrc to match your JSON response structure. Maybe something like this:

dataSrc: 'doc.children'

Kevin

GhaLzai

no it effects my other doc attributes.
my full code looks like this
` <script type="text/javascript">

    $(document).ready(function(){

    var table = $('#example').DataTable( {
      ajax: {
        url : "https://2057-185-202-239-227.ngrok.io/employee/employeesByCompany/"+sessionStorage.getItem('Companies_id'),
        dataSrc: "doc",
      },
      columns: [
        { data: 'spouse' },
        { data: 'CNIC' },
        { data: 'fatherName' },
        { data: 'motherName' },
        { data: 'employeeID' },       
        {data: 'children'}
        { data: 'age' },
      ],
    });
  });

    </script>`

where children is also a array of objects.

kthorngren

Sorry, I thought you were just trying to show the children. You can use columns.render to loop through the children array to show all the names in the same cell.

Kevin

GhaLzai

can you provide the code example of my case?

kthorngren

First doc needs to be an array of objects. See the ajax docs for more details. I copied your example data into this test case:
http://live.datatables.net/kucejoxe/1/edit

I put the row data in an array and used columns,render to render all the names into the cell.

Kevin