Javascript 如何使用DataTables、Ajax调用和；Json响应？

我有一个通过Thymeleaf生成的表。我想使用jQuery刷新表的内容

    <table class="table table-hover" id="main-table">
        <thead class="thead-inverse">
            <tr>
                <th class="col-md-2 text-center">Network Id</th>
                <th class="col-md-2 text-center">Rep date</th>
                <th class="col-md-2 text-center">Hashrate [KH/s]</th>
            </tr>
        </thead>
        <tbody>
            <tr th:each="networkHashrate : ${networkHashrates}" th:onclick="'javascript:openPoolModal(\''+ ${networkHashrate.id} + '\');'">
                <td class="text-center" id="hashrateId" th:text="${networkHashrate.id}"> Sample id</td>
                <td class="text-center" id="repDate" th:text="${@findAndDisplayDataService.formatDate(networkHashrate.repDate)}">Sample rep-date</td>
                <td class="text-center" id="hashrate" th:text="${@findAndDisplayDataService.formatHashrate(networkHashrate.hashrate)}">Sample hashrate</td>
            </tr>
        </tbody>
    </table>

以下是JSON响应：

[{  
  "id":1,
  "repDate":{  
     "offset":{  },
     "nano":880042000,
     "year":2018,
     "monthValue":4,
     "dayOfMonth":25,
     "hour":12,
     "minute":58,
     "second":53,
     "month":"APRIL",
     "dayOfWeek":"WEDNESDAY",
     "dayOfYear":115
  },
  "hashrate":5114926.0
},...more entries
]

打印空表时，我不断收到一个错误：

Uncaught TypeError: Cannot read property 'reload' of undefined

还有一个警告弹出窗口说：

Data Tables warning: table id=main-table - Requestem unknown parameter '0' for row 0 column 0. For more information about this error, please see: http://datatables.net/tn/4

---

编辑

我将表声明移到函数外部。现在我只是不断得到警告

---

编辑2

正如你所说的那样，数据不断刷新，但仍然存在一些问题

首先，我的

stateSave:true

属性停止工作，因此当重新加载表时，它总是返回到第一页。

---

其次，我丢失了所有样式（

class=“text:center”

）和

on:单击
html
文件中的
属性。
尝试在$（文档）之前声明表。准备：

错误与列定义有关，请尝试以下方法定义列：

 "columnDefs": [
                    {
                        "targets": 0,
                        "data": "id",
                    },
                    {
                        "targets": 1,
                        "data": "repDate",
                    },
                    {
                        "targets": 2,
                        "data": "repDate",
                    }
                ]

尝试在$（文档）之前声明表。准备就绪：

错误与列定义有关，请尝试以下方法定义列：

 "columnDefs": [
                    {
                        "targets": 0,
                        "data": "id",
                    },
                    {
                        "targets": 1,
                        "data": "repDate",
                    },
                    {
                        "targets": 2,
                        "data": "repDate",
                    }
                ]

错误消息表明
table.ajax
未定义。尝试将
表
的声明移到任何函数之外。这很有帮助。谢谢我仍然没有价值观。有什么可能出错的想法吗？我按原样检查了您的代码，没有发现
未定义的错误。您确定JSON响应位于
/refresh
？这就是整个响应吗？JSON实际上是一个数组。我已经更正了输出。错误消息表明
table.ajax
未定义。尝试将
表
的声明移到任何函数之外。这很有帮助。谢谢我仍然没有价值观。有什么可能出错的想法吗？我按原样检查了您的代码，没有发现
未定义的错误。您确定JSON响应位于
/refresh
？这就是整个响应吗？JSON实际上是一个数组。我已经更正了输出。这非常有效，但是您可以检查我的
编辑2
，因为还有一些问题与您的解决方案有关。您好！抱歉迟到了！使用jquery处理click事件：$（“#main table tbody”）.on（'click'，tr'，function（）{var data=table.row（this.data（）；//对数据执行任何操作（您可以从服务器获取所有数据，而不仅仅是DataTable}）；如果这不起作用，我有另一个解决方案给你！幸运的是，这非常有效，但是你能检查我的
Edit 2
，因为还有一些问题与你的解决方案有关。嗨！抱歉迟到了！使用jquery处理点击事件：$（'#main table tbody'）。on（'click'，tr'，function（）{var data=table.row（this）.data（）；//对数据执行任何操作（您可以从服务器获取所有数据，而不仅仅是DataTable}中显示的数据）；如果此操作不起作用，我可以为您提供另一个解决方案！祝您好运
 "columnDefs": [
                    {
                        "targets": 0,
                        "data": "id",
                    },
                    {
                        "targets": 1,
                        "data": "repDate",
                    },
                    {
                        "targets": 2,
                        "data": "repDate",
                    }
                ]