将复制、PDF 和 Excel 按钮添加到数据表答案

【问题标题】：Add Copy, PDF and Excel buttons to Datatable将复制、PDF 和 Excel 按钮添加到数据表
【发布时间】：2015-11-18 00:47:58
【问题描述】：

我是 jquery、MVC 等方面的新手。我正在用 VS2015、MVC 5、Database First 设计一个网站。在我的索引页面上，我已经成功添加了具有分页、排序、搜索和过滤功能的数据表。现在我正在尝试添加按钮以“自动”复制或保存到 pdf 或 excel。我的按钮没有出现在任何地方，不确定问题可能是什么。我在布局页面中添加了对buttons.dataTables.min.css 的引用。我想知道我是否正确“安装”了扩展程序，但再次不确定。这是我呈现数据表的代码的样子：

$(document).ready(function () {
    $('#instrumentsTable').dataTable({ stateSave: true, autoWidth: true, buttons: ['copy', 'excel', 'pdf']}).columnFilter(
        { (list of column specs)...

我已经在互联网上进行了详尽的搜索。找到了很多对 TableTools 的引用，但是已经被淘汰了。非常感谢任何帮助和反馈。 ~~~特蕾西

【问题讨论】：

你可以试试其他插件，比如这个：ngiriraj.com/pages/htmltable_export/demo.php ...看起来也很简单
您使用的是哪个版本的数据表？如果版本低于 1.10.8，则需要 TableTools - 否则，您是否引用按钮 css/js 文件？ datatables.net/download/release
我使用 TableTools 和最新版本的 Datatables 来完成您所描述的这项任务，它们可以完美地协同工作。到目前为止，实现这一目标的最简单方法。

标签： jquery pdf datatables

【解决方案1】：

我终于让它工作了。我有 1.10.7 版的 Datatables，通过 NuGet 获得，它没有显示任何可用的升级（re: 1.10.8）。

所以，我去了以下页面http://datatables.net/download/index 来“构建”我自己的带有扩展的数据表。这是一个很棒的工具......在我选择了我需要的选项后，下载包括 2 个简单的文件，其中包含所有内容......脚本和 css 文件。这就是我必须在我的页面中引用的所有内容（在将它们添加到我的项目之后）。这是我下载的内容：

DataTables (1.10.8)
Buttons
HTML5 Exports (required for local file saving)
JSZip (required for Excel button)
pdfmake (required for PDF button)
printview

我在打包部分也选择了：缩小、单个文件、本地文件。

将下载的脚本和 css 文件包含到我的项目中后，下面是可以运行的代码：

$(document).ready(function () {
    $('#instrumentsTable').dataTable({ stateSave: true, autoWidth: true, dom: 'Bfrtip', buttons: ['print', 'pdf', 'excel'] }).columnFilter(
        {... column filter stuff...

【讨论】：