Datatable.js устанавливает заголовок столбца динамически из данных JSON - PullRequest
Новая
       23

Datatable.js устанавливает заголовок столбца динамически из данных JSON

0 голосов
/ 03 октября 2019

Я использую Datatabls для отображения данных таблицы через ajax. Но иногда имена столбцов разные. Поэтому я получаю их с сервера в списке массивов с данными json. Теперь, используя пустой thead, вы хотите поместить в него фактические имена столбцов.

Мой JS: 

$('#DTable').DataTable({
    "processing": true,
    "serverSide": true,
    "ajax": {
        "url": "data.php",
        "type": "POST",
        "dataType": "json",
        "dataSrc": "data"
    }
});

Мой JSON: 

{
"col": [
    "A",
    "B",
    "C",
    "D",
    "E"
],
"data": [
    [
        "Umn(i4(5P~",
        "wA~W70Vtmj",
        "^taMfGgmKC",
        "klPx6XrZR*",
        "H6ooRlotEB"
    ],
    [
        "DrUE)Z234C",
        "udN2BJOSpn",
        "GWjU3~*hbr",
        "IFIk1t1!m(",
        "kH*Yypo5)E"
    ],
    [
              .........
    ]
]}

Предположим, мне нужно использовать: 

        "dataFilter": function(res) {
            res.col.....
        }

и 

"columnDefs": [
      { "title": "My custom title", "targets": 0 }
]

Но мои странные данные не относятся к типу данных json, и я не могу использовать res.col, чтобы перечислить и поместить их, а также не знаю, как именно ... .

1 Ответ

0 голосов
/ 04 октября 2019

OK. Я нашел решение. Может быть, не самый лучший, но он работает. 

// First call standard ajax request for getting column names
$.ajax({
    url: "data.php",
    type: "POST",
    dataType: "json",
    success: function(res) {

        //put column names into thead
        $('#DTable thead tr').empty();
        var cols=res.col;
        for (var i=0; i<cols.length; i++) {
            $('#DTable thead tr').append('<th>'+cols[i]+'</th>');
        }

        // initialise Datatable
        $('#DTable').DataTable({
            processing: true,
            serverSide: true,
            deferRender: true,
            ajax: {
                url: "data.php",
                type: "POST",
                dataType: "json",
                dataSrc: "data"
            }
        });
    }
});
...