jQuery Datatables - 未为 Ajax 响应填充表答案

【问题标题】：jQuery Datatables - Table not populated for Ajax responsejQuery Datatables - 未为 Ajax 响应填充表
【发布时间】：2013-03-28 18:59:29
【问题描述】：

我正在尝试将 jquery 数据表与服务器端处理集成到一个 UI 组件中。请求 url 返回一个 json。 JSON 格式良好并通过了 jsonlint 验证。

这是从 firebug 获取的典型 json 响应。

{
    "sEcho": 1,
    "iTotalRecords": 6416,
    "iTotalDisplayRecords": 5,
    "aaData": [
        {
            "0": 421367,
            "1": "Test1",
            "2": "NEW",
            "3": "Default",
            "4": "18 Aug 2011 20:27:12 GMT",
            "5": "TestBench",
            "6": "NA"
        },
        {
            "0": 421368,
            "1": "Test2",
            "2": "NEW",
            "3": "Default",
            "4": "18 Aug 2011 20:27:12 GMT",
            "5": "TestBench",
            "6": "NA"
        },
        {
            "0": 421369,
            "1": "Test3",
            "2": "NEW",
            "3": "Default",
            "4": "18 Aug 2011 20:27:12 GMT",
            "5": "TestBench",
            "6": "NA"
        },
        {
            "0": 421370,
            "1": "Test4",
            "2": "NEW",
            "3": "Default",
            "4": "18 Aug 2011 20:27:13 GMT",
            "5": "TestBench",
            "6": "NA"
        },
        {
            "0": 421371,
            "1": "Test5",
            "2": "NEW",
            "3": "Default",
            "4": "18 Aug 2011 20:27:13 GMT",
            "5": "TestBench",
            "6": "NA"
        }
    ]
}

脚本：

 $(document).ready(function() {
   var thisTable;  
    thisTable = $('#events').dataTable( {
      "bProcessing": true,
      "bServerSide": true,
      "bJQueryUI": true,
      "sPaginationType": "full_numbers",
      "sAjaxSource": "http://localhost:9000/dt/data/all"
    });
  });

我在屏幕上看到处理窗口，它不会停止。桌子还是空的。

我这里有什么遗漏吗？

sEcho 有问题吗？因为我一直在看到处理窗口。

【问题讨论】：

您是否尝试使用aoColumns 设置列？
是的，我最初尝试使用 mdata 指定列。它不起作用，所以改回 0,1,2,3 默认表示法。
i.imgur.com/7sjlfyA.png - 请求/响应标头。

标签： javascript jquery datatables

【解决方案1】：

我遇到了同样的问题，即处理消息永远不会停止，但发布响应没有任何错误。我检查了 POST 数据，我的错误是更改页码后浏览器发送到服务器 sEcho=2（如果单击第 2 页）但我的服务器端代码仍然发送回浏览器 sEcho=1，因此导致错误。我已经从请求参数中获取了正确的 sEcho 值并将其放入我的 json 响应数据中，现在它可以正常工作了！！

String sEcho =request.getParameter("sEcho");

【讨论】：

【解决方案2】：

我认为您的设置需要一个数组数组。你的数据是一个对象数组。所以你必须使用“aoColumns”选项（http://www.datatables.net/release-datatables/examples/ajax/objects.html）

所以我认为应该是这样的：

$(document).ready(function() {
    var thisTable;  
    thisTable = $('#events').dataTable( {
        "bProcessing": true,
        "bServerSide": true,
        "bJQueryUI": true,
        "sPaginationType": "full_numbers",
        "sAjaxSource": "http://localhost:9000/dt/data/all"
        "aoColumns": [
            { "mData": "0" },
            { "mData": "1" },
            { "mData": "2" },
            { "mData": "3" },
            { "mData": "4" },
            { "mData": "5" },
            { "mData": "6" },
        ]
    });
});

这个小提琴似乎对我有用（但我无法测试 sAjaxSource 属性，因为它需要一个我无法访问的 url）http://jsfiddle.net/thomasjonas/jW7uC/1/

【讨论】：

感谢您的回复。我尝试过使用和不使用 mData - 我仍然得到空表:-(。处理窗口一直保持打开状态。Firebug 显示成功（200 OK）。
不。只有成功响应。 (200 OK 89ms)
你检查请求中的sEcho参数是否与服务器返回的sEcho参数相同？我不确定它可能是什么......具有相同 JSON 数据的 .txt 文件是否有效？
感谢您的想法。是的，测试文件有效。所以我想，问题出在 ajax URL 上。会试着弄清楚。不过，使用浏览器/rest 客户端插件的 GET 可以完美运行。
响应的内容类型是什么？是应用程序/json 吗？