Question

我正在初始化一个dataTable并使用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和name的java bean，这是我的colums）。

当我运行这个时，我没有在页面中看到任何数据，我也使用了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 字段返回一个对象。你不能单独返回数组。

Answer 2

我不确定，但首先你需要检查firebug或devtools是否正确获取数据。如果是，则可能是您的代码错误。我从文档中复制了这个：

"fnServerData": function ( sSource, aoData, fnCallback, oSettings ) {
    oSettings.jqXHR = $.ajax( {
        "dataType": 'json', 
        "type": "POST", 
        "url": sSource, 
        "data": aoData, 
        "success": fnCallback
   });
},//....

我不知道代码中的request是什么，但请确保使用上面的代码。

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

2 个答案: