jquery datatables - получить столбцы из json

Question

В jquery Datatables можно определить столбцы с помощью серверного скрипта?Мне нужно что-то вроде этого

Столбцы с датами должны быть загружены с сервера.Тогда количество столбцов может варьироваться.

Answer 1

Я думаю, что нашел то, что вы искали

Я вставлю некоторый код + опубликую ссылку на похожий вопрос ', в котором вы получите гораздо больше информации ...

$.ajax( {
    "url": 'whatever.php',
    "success": function ( json ) {
        json.bDestroy = true;
        $('#example').dataTable( json );
     },
    "dataType": "json"
} );

где json - что-то вроде этого

{

"aaData": [
[ "2010-07-27 10:43:08", "..."], [ "2010-06-28 17:54:33", "..."],
[ "2010-06-28 16:09:06", "..."], [ "2010-06-09 19:15:00", "..."]
] ,

 "aaSorting": [
  [ 1, "desc" ]
 ],

 "aoColumns": [
   { "sTitle": "Title1" },
   { "sTitle": "Title2" }
 ]

}

здесь ссылка на оригинальный поток

Определение столбца через массив JSON (ajax)

Answer 2

Чтобы расширить то, что говорил Камал Дип Сингх:

Вы можете динамически создать таблицу на лету, а затем применить к ней таблицы данных, чтобы получить функциональность таблиц данных.

// up in the html
<table id="myDatatable" class="... whatever you need..."></table>

, а затем:

// in the javascript, where you would ordinarily initialize the datatable
var newTable = '<thead><tr>'; // start building a new table contents

// then call the data using .ajax()
$.ajax( {
    url: "http://my.data.source.com",
    data: {}, // data, if any, to send to server
    success: function(data) {
        // below use the first row to grab all the column names and set them in <th>s
        $.each(data[0], function(key, value) {
            newTable += "<th>" + key + "</th>";
        });
        newTable += "</tr></thead><tbody>";                  

        // then load the data into the table
        $.each(data, function(key, row) {
             newTable += "<tr>";
              $.each(row, function(key, fieldValue) {
                   newTable += "<td>" + fieldValue + "</td>";
              });
             newTable += "</tr>";
        });
       newTable += '<tbody>';

       $('#myDatatable').html(newTable); // replace the guts of the datatable's table placeholder with the stuff we just created. 
    }
 });

 // Now that our table has been created, Datatables-ize it
 $('#myDatatable').dataTable(); 

Обратите внимание, что вы можете поместить параметры в этот .dataTable () как обычно, однако не 'sAjaxSource' или любую из связанных функций получения данных- это применение таблиц данных к уже существующей таблице, которую мы создали на лету.

Хорошо, это своего рода хакерский способ, но он должен работать.

В настоящее время не существует встроенного метода, позволяющего делать это динамически с таблицами данных.Смотрите здесь: https://github.com/DataTables/DataTables/issues/273