Question

我目前正在使用DataTables在网页中绘制表格。我有一个没有隐藏的表，用户可以毫无问题地查看它。另一方面，我有一个隐藏的表，必须同时导出非隐藏表。

我希望能够点击＆＃34;导出PDF＆＃34;在非隐藏表中生成带有两个表的PDF文件，隐藏表和非隐藏表。

有人可以帮助我吗？我对如何做到这一点感到有些困惑。

Answer 1

我没试过这个，但你可以尝试从第一个按钮触发第二个按钮。

$("#foo .buttons-pdf").on("click", function() {
  $("#bar .buttons-pdf").trigger("click");
});

第二个表仍然需要在DOM中可用。

Answer 2

如果你有相同的表格，这很容易。只需要第三个（或第四个等）隐藏表，您只能用于出口目的。当你的＆＃34; PDF＆＃34;单击按钮按照以下步骤操作：

事先将*_wrapper容器设置为display: none;，以免用户在屏幕上看到闪烁或乱码
使用API从所有表中收集数据并合并它们
初始化隐藏的导出表，并将合并的数据用作data源
以编程方式触发PDF导出
清理隐藏的导出表，以便在用户尝试再次导出时不会发生冲突

===

$('#example').DataTable({ });
$('#example2').DataTable({ });

$('button').on('click', function() {
  var data = $('#example').DataTable().table().data();
  $.merge( data, $('#example2').DataTable().table().data() );
  $('#export-table').DataTable({
    dom: 'B',
    data: data,
    buttons: [{
      extend: 'pdfHtml5'
    }],
    drawCallback: function() {
      $('#export-table_wrapper .buttons-pdf').click()
       setTimeout(function() {
          $('#export-table').DataTable().destroy(false);
       }, 200)
    }
  })
})

这是一个带有一个可见表，一个隐藏表和第三个表来处理导出的演示 - ＆gt;的 https://jsfiddle.net/u20x4be0/

如何在一个PDF文件中导出两个DataTable

2 个答案: