使用下面的代码,我可以让TableTools
按钮显示在页面上,正确设置样式,甚至更改mouseover
事件上的鼠标图标,但是导出功能不起作用。当我单击按钮时,什么也没有发生。甚至不会收到错误消息。
DataTable
在用户点击“搜索”按钮之前,该插件TableTools
正在使用的页面上不存在。完成此操作后,Ajax 调用将提取相关数据并创建DataTable
. 同样,程序的这部分工作正常,但是当我单击“导出”按钮(CSV、Excel、PDF)时……什么也没有发生。
jQuery
$.ajax({
type: 'GET',
url: '@Url.Action("PensgcReport", "Home")',
data: { inputArray: inputArray },
traditional: true,
success: function (data) {
//Unpack return object into 2D array
var array = [];
$.each(data, function (key, value) {
var tempArray = [];
$.each(value, function(key, value) {
tempArray.push(value);
});
array.push(tempArray);
});
console.log(array);
$('#ReportTable').dataTable({
"bDestroy" : true,
"aaData": array,
"aoColumns": headers,
"bFilter": false,
"bPaginate": false,
"bLengthChange": false,
"bFilter": false,
"bSort": false,
"bInfo": false,
"aaSorting": [],
"oLanguage": {
"sSearch": "Filter results:"
},
"sDom": 'T<"clear">lfrtip',
"tableTools": {
"sSwfPath": "Content/media/copy_csv_xls_pdf.swf",
"aButtons":
[
{
'sExtends': 'csv',
"sFileName": "PENSGC_Report_" + new Date() + ".csv",
'mColumns': [0, 1]
},
{
'sExtends': 'xls',
"sFileName": "PENSGC_Report_" + new Date() + ".xls",
'mColumns': [0, 1]
},
{
'sExtends': 'pdf',
"sFileName": "PENSGC_Report_" + new Date() + ".pdf",
'mColumns': [0, 1]
},
]
}
});
}
})
HTML
这是页面加载时呈现的 HTML(没什么特别的)
<table id="ReportTable" class="pretty">
</table>
文件夹结构