导出到 CSV/Excel 功能在 Datatable 中不起作用?
Posted
技术标签:
【中文标题】导出到 CSV/Excel 功能在 Datatable 中不起作用?【英文标题】:Export to CSV/Excel feature does not work in Datatable? 【发布时间】:2013-10-18 03:59:35 【问题描述】:我使用 jquery Datatable 插件,并按照How can I export tables to excel from a webpage 在我的表格上方添加几个按钮(复制/csv/excel/pdf/print),但导出操作(复制&csv&excel&pdf)对我不起作用,下面是我的主要代码:
<head>
<style type="text/css" title="currentStyle">
@import "../../media/css/demo_page.css";
@import "../../media/css/demo_table.css";
@import "media/css/TableTools.css";
</style>
<script type="text/javascript" charset="utf-8" src="../../media/js/jquery.js"></script>
<script type="text/javascript" charset="utf-8" src="../../media/js/jquery.dataTables.js"></script>
<script type="text/javascript" charset="utf-8" src="media/js/ZeroClipboard.js"></script>
<script type="text/javascript" charset="utf-8" src="media/js/TableTools.js"></script>
<script type="text/javascript" charset="utf-8">
$(document).ready( function ()
$('#example').dataTable(
"sDom": 'T<"clear">lfrtip',
"oTableTools":
"sSwfPath": "/swf/copy_cvs_xls_pdf.swf"
);
);
</script>
</head>
有什么帮助吗?另外:我想做的是让这些按钮在this page中作为“复制/打印/保存”工作@
【问题讨论】:
您使用的是哪种浏览器? @JannisHanke 正在使用 Chorme? 确保您的 .swf 路径正确。配置文件是否也在正确的文件夹中? 我看不懂配置文件?我只导入了上面代码显示的 4 个 js 和 3 个 css 文件,.swf 的路径是正确的(我可以得到这个基于 .swf 的按钮,但除了“打印”按钮之外它们不起作用),谢谢你的回复! 【参考方案1】:试试这个:
"oTableTools":
"sSwfPath": "copy_csv_xls_pdf.swf",
"aButtons": [
"sExtends": "collection",
"sButtonText": "Export",
"aButtons": [
'sExtends': "csv"
,
'sExtends': "xls"
,
'sExtends': "pdf"
,
'sExtends': "print"
,
],
],
【讨论】:
【参考方案2】: var oTable = $('#tblView').dataTable(
"bJQueryUI": true,
"sScrollX": "500px",
"sPaginationType": "full_numbers",
//"sDom": 'T<"clear">lfrtip',
// "sDom": '<"clear">lfrtipT',
"sDom": '<"H"lTfr>t<"F"ip>',
"aLengthMenu": [[10, 25, 50, 100, -1], [10, 25, 50, 100, "All"]],
"iDisplayLength": 10,
"oTableTools":
"sSwfPath": "../Content/swf/copy_csv_xls.swf",
"aButtons": [
"sExtends": "xls",
"mColumns": [2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22],
"sPdfOrientation": "landscape",
"sButtonText": "Export to Excel",
]
, "bDestroy": true,
"aoColumnDefs": [
'bSortable': false,
'aTargets': [0, 1]
],
);
use css and script
<link href="~/Content/themes/base/demo_page.css" rel="stylesheet" />
<link href="~/Content/themes/base/demo_table_jui.css" rel="stylesheet" />
<link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" />
<link href="~/Content/themes/base/TableTools.css" rel="stylesheet" />
<script src="~/Scripts/js/jquery-1.8.2.js"></script>
<script src="~/Scripts/js/jquery.ui.core.js"></script>
<script src="~/Scripts/js/jquery.ui.widget.js"></script>
<script src="~/Scripts/js/jquery.ui.datepicker.js"></script>
<script src="~/Scripts/js/jquery.dataTables.js"></script>
<script src="~/Scripts/js/jquery.ui.dialog.js"></script>
<script src="~/Scripts/js/dataTables.tableTools.min.js"></script>
【讨论】:
【参考方案3】:我刚刚实现了可在客户端运行且无需闪存的解决方案: https://github.com/zedxter/DataTablesCSV
【讨论】:
以上是关于导出到 CSV/Excel 功能在 Datatable 中不起作用?的主要内容,如果未能解决你的问题,请参考以下文章
如何在 vuetify 数据表上添加导出 csv、excel 按钮?
如何在 ruby on rails 中显示 Datatable 表格工具(复制、csv、excel、pdf、保存)
如何自定义 jquery 数据表导出,例如 PDF Excel Print 和 CSV?