多个Jquery数据表不能在同一页上工作

Question

我的页面上有两个HTML表格，我想用jQuery数据表填充数据。问题是，它只为第一个表加载/渲染数据，当我尝试对第二个表执行相同操作时，它不工作。

jQuery代码：我提出dataTable的代码放到一个方法LoadGrid，并调用它的两个表：

的数据表

$.ajax({ 
     data: JSON.stringify(data), 
     url: urlGetData, 
     type: 'POST', 
     contentType: "application/json; charset=utf-8", 
     success: function (obj) { 
      var object = jQuery.parseJSON(obj.data); 
      LoadGrid("#tblActivitySummary", object.ActivitySummary, columnKeys, pageCount); //Create datatable for first table 
      LoadGrid("tblPaymentSummary", object.PaymentSummary, columnKeys, pageCount); //Create datatable for Second table 
      } 
     }); 

方法：

function LoadGrid(tableId, gridData, columnKeys, pageCount) { 
     $(tableId).dataTable().fnClearTable(); 
     $(tableId).dataTable({ 
      "pageLength": pageCount, 
      "bDestroy": true, 
      "bInfo": true, 
      "bSort": true, 
      data: gridData, 
      columns: columnKeys 
     }); 
    } 

为什么它没有呈现第二表？

Answer 1

看起来你错过了第二个选择器前面的'＃'。

LoadGrid("#tblActivitySummary", object.ActivitySummary, columnKeys, pageCount); //Create datatable for first table 
LoadGrid("#tblPaymentSummary", object.PaymentSummary, columnKeys, pageCount); //Create datatable for Second table