В jQuery datatables не отображаются заголовки

Question

Я пытаюсь получить динамические заголовки для jquery datatables от объекта, но он их не рисует.

Например, с этим объектом:

var tableData = [ 
    { id: 1, user: 'admin', pass: 'pass', role: 'admin' },
    { id: 2, user: 'user', pass: 'pass', role: 'user' } 
]

это мойМетод:

function generateDatatable(tableId, tableData) {

    var columns = [];
    if (tableData.length == 0) {
        columns[0] = { data: '-' };
    } else {
        Object.keys(tableData[0]).forEach(element => {
            columns[columns.length] = { data: element };
        });
    }

    jQuery('#' + tableId).DataTable({
        data: tableData,
        language: dataTablesTexts,
        pagingType: 'full',
        lengthMenu: [
            [10, 25, 50, -1], 
            [10, 25, 50, 'All']
        ],
        searching: true,
        ordering:  true,
        paging: true,
        select: false,
        info: true,
        responsive: true,
        columns: columns
    });

}

Я вижу значения, но не заголовки.

Результирующие столбцы будут выглядеть следующим образом:

var columns = [
    {data: "id"},
    {data: "user"},
    {data: "pass"},
    {data: "role"}
]

, если я изменю data: "..." наtitle: "..." Я вижу названия, но не значения.

Что может быть не так с кодом.

Answer 1

Вы должны использовать оба: data, чтобы указать на конкретное свойство в источнике данных, которое соответствует текущему столбцу для каждой записи, и title, чтобы указать заголовок столбца.