数据表 - 动态列

Question

我知道之前已经问过这个问题,但我的变化与其他答案不符.

我有一个这种形式的json数据源:

    {
      "columns":[
          {"title":"Store Number","data":"StoreNbr"},
          {"title":"Store Name","data":"StoreName"},
          {"title":"2016-01-01","data":"2016-01-01"},
          {"title":"2016-01-02","data":"2016-01-02"}
      ],
      "data":[
          {"2016-01-01":"51","StoreNbr":"1","StoreName":"Store 1","2016-01-02":"52"}
      ]
  }

我正在加载这样的数据:

$("#datatable").DataTable({
            "ajax": {
            "url": "http://myjsonurl-that-produces-above-response",
           "dataSrc": "data"
        },

    "columns": [
       {"title":"Store Number","data":"StoreNbr"},
       {"title":"Store Name","data":"StoreName"},
       {"title":"2016-01-01","data":"2016-01-01"},
       {"title":"2016-01-02","data":"2016-01-02"},
     ],   
     dom: "Bfrtip",
    "bProcessing": true,
    "bServerSide" : true
});

以上工作完美无瑕.我需要的是动态加载列,如下所示:

"columns": $.getJSON($('#datatable').DataTable().ajax.url(), 
           function(json){
              return (JSON.stringify(json.columns));  
           });

我得到的只是一个aDataSource错误.如果我在代码中的任何其他位置运行.getJSON,我会获得预期的响应,即我需要的响应.有任何想法吗？

我想让它工作,因为它最好是因为我的数据源不断变化基于我应用的影响json源,数据集等的过滤器.

更新:

表的初始化方式:

<script type="text/javascript"> 
          TableManageButtons.init();

TableManageButtons = function () {"use strict"; return { init: function () { handleDataTableButtons()  } }}();

var handleDataTableButtons = function () {
    "use strict";
    0 !== $("#datatable-buttons").length && $("#datatable-buttons").DataTable({
            "ajax": {
            "url": "http://myjsonurl.php",
.......

Answer 1

尝试先获取列,然后继续进行数据表初始化:

$.getJSON('url/for/colums', function(columnsData) {
   $("#datatable").DataTable({
      ...
      "columns": columnsData
   });
});

编辑

如果我理解正确,你想这样做:

$("#datatable").DataTable({
       "ajax": {
       "url": "http://myjsonurl-that-produces-above-response",
       "dataSrc": "data"
    },
    "columns": getColumns(), //Execute $.getJSON --> asynchronous (the code continous executing without the columns result)
    dom: "Bfrtip",
    "bProcessing": true,
    "bServerSide" : true
});

这样,当您调用getColumns()执行是异步的时,所以列将是未定义的.

这就是你必须在getJSON回调函数中调用DataTable初始化程序的原因.

另一种方法可能是在非异步函数设置中获取列async: false(检查此问题)