jquery - 无法使 DataTables ajax 调用正常工作

Question

我正在尝试弄清楚如何使用 ajax DataTables 1.10 中的选项。对于我的生活，我无法弄清楚它是如何工作的。

我的服务器端请求在被查询时以一个对象作为响应，其中一个元素是一个与我的表的列布局匹配的数组。我使用的初始化代码是:

$("#history-table").DataTable({
    'ajax': {
        'url': "/some-path-here",
        'type': "POST",
        'data': { 'pid': pID } // Some data that the server needs
    },
    'columns': [
        { data: 0},
        { data: 1},
        { data: 2},
        { data: 3},
        { data: 4},
        { data: 5}
    ],
    'dataSrc': 'history',
    'autoWidth': false,
    'lengthChange': false,
    'ordering': false,
    'pageLength': 50
});

我的 AJAX 调用返回的对象如下所示(每个元素都是一个字符串):

{
    'success': True,
    'history': [
        ["John Doe", "02 Mar 2016", "Area 1", "Value A", "May 15", "200"],
        ["Jane Doe", "29 Feb 2016", "Area 2", "Value B", "Apr 15", "100"],
        [ ... ]
    ]
}

我的服务器端逻辑正在正确处理和返回，但我从缩小的 DataTables 代码中收到一条无用的错误消息:

TypeError: f is undefined

我怎样才能弄清楚我真正的问题是什么？有什么明显的我想念的吗？ DataTables 文档不是很有用，因为它们的所有 AJAX 示例似乎都是从文本文件中提取的。

Answer 1

• 选项 dataSrc 应该是 ajax 选项的子属性。
• 如果数据元素按顺序出现，则无需指定列

• 您的 JSON 响应似乎无效。正确的 react 应该是

  {
    "success": true,
    "history": [
      ["John Doe","02 Mar 2016","Area 1","Value A","May 15","200"],
      ["Jane Doe","29 Feb 2016","Area 2","Value B","Apr 15","100"]
    ]
  }
  

修改后的代码如下:

$("#history-table").DataTable({
    'ajax': {
        'url': "/some-path-here",
        'type': "POST",
        'data': { 'pid': pID },
        'dataSrc': 'history'
    },
    'autoWidth': false,
    'lengthChange': false,
    'ordering': false,
    'pageLength': 50
});

参见 this jsFiddle用于代码和演示。