带有Java Json的Jquery数据表不起作用答案

【问题标题】：Jquery Datatables with Java Json not working带有Java Json的Jquery数据表不起作用
【发布时间】：2016-09-16 09:27:15
【问题描述】：

我试图在我的应用程序中添加 DataTable。 https://datatables.net/ 我有一个网页，其中数据表将在 onclick 事件上显示，当系统触发 onclick 事件 ajax 调用时，数据将来自 Java servlet。下面是我的代码

JSP：

<table id="testTable" class="display" cellspacing="0"
                            width="100%" cellpadding="0" border="0">
                            <thead>
                                <tr>
                                    <th>Test</th>
                                    <th>Description</th>
                                    <th>Result</th>
                                    <th>Start Time</th>
                                    <th>End Time</th>
                                </tr>
                            </thead>

                        </table>

jQuery:

    function getTestData(name, e, bId) {
        $('#testTable').dataTable( {

             "serverSide": true,
            "processing": true,
            "ajax":{                
            "type" : "POST",
            "dataSrc": "data",
            "url" : "Servlet",
            "dataType": "json",
            "data" : {
                name : name,
                e : e,
                bId : bId,
                method : "getTestData"
            },
             "sEcho": 0,
             "processing": true,
              "columns":[
                        { "data": "tId" },
                        { "data": "description" },
                        { "data": "rst" },
                        { "data": "startDate" },
                        { "data": "endDate" }
                    ]    
             }
        } ); 
    }

Servlet 在 JSON 以下返回：

    {
        "data": [
        {
             "tId": "1",
             "description": "desc",
            "rst": "P",
             "startDate": "2016-09-13 07:59:31.0",
             "endDate": "2016-09-13 07:59:51.0"
      },
       {
             "tId": "2",
            "description": "desc",
            "rst": "S",
              "startDate": "2016-09-13 07:59:51.0",
            "endDate": "2016-09-13 07:59:51.0"
           }
        ] 
      }

我遇到以下错误：

 DataTables warning: table id=testTable - Requested unknown parameter '0' for row 0, column 0.

我知道错误的原因，但不确定我在上面的代码中做错了什么，我猜 jquery 代码有问题。请帮忙。

提前致谢

【问题讨论】：

如果您使用{ "data":0 }, { "data":1 } 等...是否有效？
是的，但没有运气......
您的意思是“是”它有效，还是“不是”它无效？
我试过了，但它也不起作用......我的 jquery 和 json 好吗？
你的 json 不正确。您已打开服务器端处理。看看这个documentation 了解更多信息

标签： java jquery json datatables

【解决方案1】：

JSON 应该是下面提到的格式

{
  "draw": 1,
 "recordsTotal": 57,
"recordsFiltered": 57,
"data": [
 [
  "Airi",
  "Satou",
  "Accountant",
  "Tokyo",
  "28th Nov 08",
  "$162,700"
],
[
  "Angelica",
  "Ramos",
  "Chief Executive Officer (CEO)",
  "London",
  "9th Oct 09",
  "$1,200,000"
]
 ]   
}

https://datatables.net/examples/data_sources/server_side.html

【讨论】：

【解决方案2】：

更改您的初始化代码以匹配您的 JSON 数据格式，如下所示。

$('#testTable').dataTable({
    "ajax": {
        "type": "POST",
        "url": "Servlet"
    },
    "columns": [
       { "data": "tId" }, 
       { "data": "description"}, 
       { "data": "rst" }, 
       { "data": "startDate" }, 
       { "data": "endDate"}
    ]
});

有关代码和演示，请参阅this jsFiddle。

【讨论】：

【解决方案3】：

你初始化数据表的方式不正确，可以查看here的不同方式。

@Gyrocode.com 的答案来自您可能正在努力解决的问题。我只是再给你一个答案，我想也许可以考虑获取数据并将其传递给你的数据表

        $.getJSON("http://example/servlet_data.json", function(fromServer) {

            $('#testTable').DataTable( {
                data: fromServer.data,
                columns: [
                    { data: "tId" },
                    { data: "description"},
                    { data: "rst"},
                    { data: "startDate"},
                    { data: "endDate"}
                    ]
            } );

    }).fail(function(){
        alert("Error occurred getting data from the server");
    })

愉快的编码

【讨论】：