1

在使用 JavaScript 对数据库进行 Ajax 调用后，我在客户端有 8000 行 JSON 格式的数据，我需要将这些数据填充到 HTML 表中以进行显示。

我正在尝试运行下面的代码，但遇到以下问题：由于我有大量数据，当我在 Web 界面上查询时，会进行几次 Ajax 调用以从数据库中提取数据并在 HTML 页面上显示相同的数据。

我面临以下问题：

  1. 只有当结果很大时我才会看到分页
  2. 出现分页时，所有数据首先加载到页面上，而不是每页 10 或 25 个，因此我的 jQuery 脚本变得无响应。但是在我切换分页大小过滤器 10、25、50 或 100 后，会出现正确数量的结果。

我正在尝试的代码如下。

HTML：

    <table id="tableprint" class="data-grid" size="50">
      <thead>
        <tr>
          <th>Name</th>
          <th>Age</th>
          <th>Profession</th>
          <th>Address</th>
          <th>Comments</th>
        </tr>
      </thead>
    </table>

JAVASCRIPT：

success: function(data) {
   $('#tableprint').dataTable({
      "aaData": jsonArrayOfjsonObjects.json, //this is a json with 8000 table rows of data
      "aoColumnsDef": [{
         "mData": "name"
      }, {
         "mData": "age"
      }, {
         "mData": "profession"
      }, {
         "mData": "address"
      }, {
         "mData": "comments",
         "defaultContent": "Empty"
      }, ],
      "bDestroy": true
   }).fnDestroy();

   $('#tableprint').dataTable({
      "bDestroy": true
   }).fnDestroy();
}

仅供参考，我正在销毁数据表实例，因为我收到“无法重新实例化 DataTable”错误，这是推荐的解决方案。

   $.ajax({
        type : 'POST',
        url : 'sendData',
        data : { //Send form data to the Servlet
            sid : sid,
            mpid : mpid
        },
        success : function(data) {
            $('#tableprint').dataTable({
               "aaData" : data.ActionsArr,
               "bPaginate":"true",
               "sPaginationType":"full_numbers",
               // etc..
        }

每次用户单击表单上的提交按钮时，都会调用上面的 Ajax Post，并使用不同的sid和mpid值。

包含的 JS 文件：

<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="https://cdn.datatables.net/1.10.7/js/jquery.dataTables.min.js"></script>
4

1 回答 1

-1

添加以下内容：

 "paging": true,
 "pageLength": 25, //or whatever you want the page length to be

在这一行之后：

"aaData" : jsonArrayOfjsonObjects.json,
于 2015-07-15T13:13:28.520 回答