使用带有DataTables的列名和AJAX数据源

Question

我正在尝试升级我的系统使用1.10而不是1.9的DataTables,我正在尝试找到一种方法来使用JSON对象而不是列表来传回行内容.具体而言,不是以[['data','data','data'],['data','data','data'],etc..]我希望将其格式化的格式传回数据[['colA':'data','colB':'data','colC':'data']].

现在我已经让我的AJAX函数以该格式返回数据,我正在尝试使用以下代码进行初始化:

$("table").DataTable({
    "columnDefs": [
        {"name": "wo_status", "title": "wo_status", "targets": 0},
        //repeat for each of my 20 or so fields
    ],
    "serverSide": true,
    "ajax": "url/to/ajax/function"
});

结果正确地从我的AJAX函数返回,但是DataTables正试图在第0行中找到0的索引并且未能找到它,因为我的表格单元格被其列名而不是数字索引索引.有谁知道如何告诉DataTables使用columnDefs(或在其他一些我没有找到的选项)中指定的列名而不是数字索引？

Answer 1

使用columns.data选项指定属性名称,如下所示:

$("table").DataTable({
    "columns": [
        { "data": "colA", "name": "colA", "title": "colA" },
        { "data": "colB", "name": "colB", "title": "colB" },
        { "data": "colC", "name": "colC", "title": "colC" }
        //repeat for each of my 20 or so fields
    ],
    "serverSide": true,
    "ajax": "url/to/ajax/function"
});

Answer 2

在fnServerParams函数中使用forEach ...

$("table").DataTable({

  "columns": [{
    "data": "colA"
  }, {
    "data": "colB"
  }, {
    "data": "colC"
  }],

  "serverSide": true,

  "ajax": "url/to/ajax/function",

  fnServerParams: function(data) {
      data['order'].forEach(function(items, index) {
          data['order'][index]['column'] = data['columns'][items.column]['data'];
    });
  },
});