无法使DataTables Ajax调用正常工作 [英] Can't get DataTables ajax call to work

问题描述

我试图弄清楚如何在DataTables 1.10中使用 ajax 选项.对于我的一生，我无法弄清楚它是如何工作的.

I'm trying to figure out how to use the ajax option in DataTables 1.10. For the life of me, I cannot figure out how it works.

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

My server-side request, when queried, responds with an object, one element of which is an array that matches my table's column layout. The initialization code I'm using is:

$("#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调用返回的对象如下所示(每个元素都是一个字符串):

The object returned by my AJAX call looks like the following (each element is a string):

{
    '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代码中得到了无用的错误消息:

My server side logic is processing and returning properly, but I get an unhelpful error message from the minified DataTables code:

TypeError:f未定义

TypeError: f is undefined

我怎么知道我的真正问题是什么?有什么明显的我想念的东西吗? DataTables文档不是很有帮助，因为它们的所有AJAX示例似乎都来自文本文件.

How can I figure out what my real problem is? Is there something obvious I'm missing? The DataTables documentation isn't very helpful, as all of their AJAX examples seem to pull from a text file.

推荐答案

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

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

  • Option dataSrc should be a sub-property of ajax option.
  • There is no need to specify columns if data elements appear in sequential order

  • Your JSON response appears to be invalid. Correct response should be

    {
      "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
  });
  

  有关代码和演示，请参见此jsFiddle .

  See this jsFiddle for code and demonstration.

  这篇关于无法使DataTables Ajax调用正常工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！