DataTables TableTools不能與兩個表一起工作

我在同一頁面中使用TableTools和DataTables v1.10。DataTables TableTools不能與兩個表一起工作

我的主頁有模態的表格和空div。

<div id="resultDiv"> 
    <table id="mainTable"> ... </table> 
    <div id="detailModal"> 
    <div id="detailModal-content"></div> 
    </div> 
</div> 

<script> 
$(document).ready(function() { 
    var mainTable = $('#mainTable').DataTable({ 
    "dom": 'T<"clear">lrtip', 
    "tableTools": { ... }, 
    "columns": [ 
     { 
     "data": null, 
     "render": function(data, type, row, meta) { 
      return '<a href="" onClick="return loadDetail(' + data.id + ')">Details</a>'; 
     } 
     }, 
     .... 
    ], 
    ........ 
    }); 
}); 

function loadDetail(id) { 
    $.ajax({ 
    async: false, 
    url: ..., 
    success: function(respose) { 
     var tableInstance = TableTools.fnGetInstance('detailTable'); 
     console.log(tableInstance); //null 
    } 
    });  
} 
</script>

單獨的詳細信息頁面有另一張表格，它在detailModal-content div中呈現。

<table id="detailTable"> 

</table> 

<script> 
$(document).ready(function() { 
    var mainDetailTable = $jq11('#detailTable').DataTable({ 
    "dom": 'T<"clear">ltipr', 
    "tableTools": { ... }, 
    .............. 
    }); 
}); 
</script>

這裏首先mainTableTableTools工作正常，但第二個表是不工作（我可以點擊按鈕，但點擊它不會產生xls文件）。我試圖通過在創建表here後創建表fnResizeButtons()來解決此問題。但是tableInstance爲空。

有什麼建議嗎？

來源

2015-05-08 αƞjiβ

我沒有什麼明確的「這個」是你正在努力解決的？你能澄清一下問題是什麼嗎？ – wahwahwah

從我可以告訴您遇到TableTools（不是數據表）不工作這是在模態表的問題？

我自己也有過類似的問題，當它被隱藏起來以及與Flash有關時，它就會被初始化，它可以被修復，這就是我用來解決類似的問題，沒有，除了在其最初可見表功能TableTools標籤：

$('a[data-toggle="tab"]').on('shown.bs.tab', function (e) { 
    var target_id = $(e.target).attr("href"); 
    var jqTable = $(target_id).find("table"); 
    var oTableTools = TableTools.fnGetInstance(jqTable[0]); 
    if (oTableTools != null && oTableTools.fnResizeRequired()){ 
     /* A resize of TableTools' buttons and DataTables' columns is only required on the 
     * first visible draw of the table 
     */ 
     jqTable.dataTable().fnAdjustColumnSizing(); 
     oTableTools.fnResizeButtons(); 
    } 
});

當然，你必須搶在桌上實例shown.bs.modal或任何其它事件表明你的模式，但應該解決這個問題TableTools 。

希望有所幫助。

來源

2015-05-13 06:06:56 annoyingmouse

您的函數loadDetail()不會將響應加載到<div id="detailModal-content"></div>，因此第二個表不會被初始化。

更正loadDetail()功能應該是這個樣子：

function loadDetail(id) { 
    $.ajax({ 
     async: false, 
     url: '/script.php', 
     data: { 'id' : id }, 
     success: function(response){ 
     $('#detailModal-content').html(response); 
     } 
    }); 
}

來源

2015-05-13 02:30:49

注意，如果你表頭已經是一個表，然後用jqTable [1]甚至更好jqTable.get（1）

來源

2016-02-24 17:12:30

DataTables TableTools不能與兩個表一起工作

回答

相關問題