DataTables TableTools不使用两个表

时间:2015-05-08 19:19:13

标签: javascript jquery html datatables jquery-datatables

我在同一页面中使用TableToolsDataTables v1.10

我的主页有表格和模态的空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>

此处TableTools mainTable的第一fnResizeButtons()工作正常但是第二个表无法正常工作(我可以点击按钮但点击它不会创建xls文件)。我试图通过在按照建议here创建的表格之后调用tableInstance来解决此问题。但fun_list <- list(f = function(x, params) {x+params[1]}, z = function(a, params) {a * params[1] * params[2]}) params_list <- list(f = 1, z = c(3, 5)) # goal is to create 2 new functions in global environment # fnew <- function(x) {x+1} # znew <- function(a) {a*3*5} # I've tried for(x in names(fun_list)){ force(x) assign(paste0(x, "new"), function(...) fun_list[[x]] (..., params = params_list[[x]])) } 为空。

有什么建议吗?

3 个答案:

答案 0 :(得分:2)

我可以告诉你,TableTools(不是DataTable)的问题是不能处理模态中的表吗?

我自己也遇到过类似的问题,而且当它被隐藏起来并且与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问题。

希望有所帮助。

答案 1 :(得分:1)

您的函数git push <remote> localbranch --force. 未将响应加载到loadDetail(),因此第二个表未初始化。

更正的<div id="detailModal-content"></div>函数应该类似于:

loadDetail()

答案 2 :(得分:0)

注意你的表头是否已经是一个表, 然后使用 jqTable [1] 甚至更好 jqTable.get(1)