DataTables example Nested object data (objects)

DataTables has the ability to use data from almost data JSON data source through the use of the columns.data option. In its simplest case, it can be used to read arbitrary object properties, but can also be extended to n levels of nested objects / arrays through the use of standard Javascript dotted object notation. Each dot (.) in the columns.data option represents another object level.

In this example hr.position refers to the position property of the hr object in the row's data source object, while contact.0 refers to the first element of the contact array. Any number of dots can be used to obtain deeply nested data.

The example below shows DataTables reading information for the columns from nested objects and arrays, where the structure of the row's data source in this example is:

Plain text
1
2
3
4
5
6
7
8
9
10
11
12
{
    "name": "Tiger Nixon",
    "hr": {
        "position": "System Architect",
        "salary": "$3,120",
        "start_date": "2011/04/25"
    },
    "contact": [
        "Edinburgh",
        "5421"
    ]
}