javascript – How to map json object data to datatables using Jquery

I have a JSON object data that am getting from an api call. How can I map it to two columns.
This is the JSON Object

[
    {
        "id": 322,
        "uploadStatus": 0,
        "labName": "CS Minhewene"
    },
    {
        "id": 323,
        "uploadStatus": 0,
        "labName": "CS Nacuale"
    },
    {
        "id": 324,
        "uploadStatus": 0,
        "labName": "CS Mesa"
    },
    {
        "id": 325,
        "uploadStatus": 0,
        "labName": "CS Metoro"
    },
    {
        "id": 326,
        "uploadStatus": 0,
        "labName": "CS Ngewe"
    },
    {
        "id": 327,
        "uploadStatus": 0,
        "labName": "CS Mariri"
    }
]

Whenever I try to map it I get a datatable error

DataTables warning: table id=tableBody – Requested unknown parameter
‘0’ for row 0, column 0. For more information about this error, please
see datatables.net/tn/4

This is my implementation

$.ajax({
                            type: 'GET',
                            contentType: "application/json; charset=utf-8",
                            url: 'api/getuploadbydistricts/'+this.name,
                            success: function (data) {
                                myJsonData = data;
                                console.log('data 2', myJsonData);
                                populateDataTable(JSON.stringify(myJsonData));
                                $('#tableBody').dataTable().fnDestroy();
                                },
                                 error: function (e) {
                                    console.log("There was an error with your request...");
                                    console.log("error: " + JSON.stringify(e));
                                    }
                                    });
                                    // populate the data table with JSON data
                                    function populateDataTable(data) {
                                        console.log("populating data table...");
                                        console.log('data 2', data.uploadStatus);
                                        $('#tableBody').dataTable().fnDestroy();
                                        $("#tableBody").DataTable().clear();
                                        $('#tableBody').dataTable().fnAddData( [
                                        data.uploadStatus,
                                        data.labName,
                                        ]);
                                        // clear the table before populating it with more data
                                    }

How can I display the json object to the datatable correctly, an help is appreciated

Read more here: Source link