How to set the table header from the ajax response ?

algeedg

I am newbie in html and bootstrap. I try to make a dynamic table from ajax response.
My table can display the data successfully but fail to set the table header.
I have tried read through the document. The best I can get is to change it through the columnDefs.
But I may not understand totally, I tried the following and failed.
Thanks for any suggestion.

The following is my ajax response.

{
    'data': [[1, 2, 3, 4, 1, 1], [1, 3, 4, 2, 1, 2], [1, 1, 1, 1, 1, 2], [1, 1, 2, 1, 1, 2], [1, 2, 2, 1, 1, 1]],
    'columnDefs': [{
            'title': 'My column 1',
            'targets': 0
        }, {
            'title': 'My column 2',
            'targets': 1
        }, {
            'title': 'My column 3',
            'targets': 2
        }, {
            'title': 'My column 4',
            'targets': 3
        }, {
            'title': 'My column 5',
            'targets': 4
        }, {
            'title': 'My column 6',
            'targets': 5
        }
    ]
}

colin

There are a few threads on the forum discussing that, such as this example from this thread. Hopefully those will get you going,

Colin