jquery - DataTables - fnServerData 中的自定义 AJAX 请求不起作用

Question

我正在初始化数据表并使用ajax函数加载数据。 服务器端是spring mvc + hibernate。

以下是初始化数据表的代码

$('.hist_data').on('click', function(){
    $('.myTable').dataTable( {
        "bProcessing": true,
        "bServerSide": true,
        "bJQueryUI": true,
        "sAjaxSource": "/application-monitor/getTableData",
        "fnServerData" : function(sSource, aoData, fnCallback) {
            request = $.ajax({
                "dataType" : "json",
                "type" : "POST",
                "url" : sSource,
                "data" : aoData,
                "success" : fnCallback
            });
        },
        "aoColumns": [
            { "mData": "id" },
            { "mData": "name" },]
    } );

});

/application-monitor/getTableData 返回一个对象列表(一个具有 id 和名称的 java bean，它们是我的列)。

当我运行这个时，我在页面中看不到任何数据，我也使用 firebug 来调试它，但在初始化时没有看到任何问题。

感谢任何帮助。

Answer 1

你的代码对我来说工作得很好。

我创建了一些像这样的基本标记:

<div class="hist_data">Click here</div>
<table class="myTable"></table>

我做了一个返回 json 的测试后端，如下所示:

{"aaData": [
  {"id":"1","name":"One"},
  {"id":"2","name":"Two"}
]}

结合您提供的 JavaScript 以及一些指向 jquery 和 dataTables 脚本的链接，这就是我要做的全部工作。

我怀疑问题出在你的后端代码中。特别要注意的是，您应该返回一个带有包含项目数组的 aaData 字段的对象。您不能只返回数组本身。