导出到文件时,忽略Jquery Datatables标头中的HTML [英] Ignore HTML from header in Jquery Datatables while exporting to a file
问题描述
我有一个简单的数据表.我在带有表标题的数据表中添加了自定义工具提示div. (参考).
I have a simple data table. I have added a custom tool-tip div in datatable with table's headings. (Reference).
当我尝试将文件导出到excel/pdf时,它也会在文件中添加工具提示文本.
When I try to export my file into excel/pdf, it also add the tooltip text in file as well.
数据表的设置:
$('#storyTable').DataTable({
ordering: true,"autoWidth": false,
paging: true,
searching: true,
dom: 'Bfrtip',
buttons: [
'copyHtml5',
'excelHtml5',
'csvHtml5',
'pdfHtml5'
]
} );
任何想法我该如何处理此问题.我找不到有用的东西.
Any idea how can I handle this issue. I can't find anything useful.
推荐答案
使用标记示例很不错:)但是通过链接,我看到您只是在<th>
内使用了<div class="tooltip"><span class="tooltiptext"></span></div>
的.
It would have been nice with a sample of the markup :) But by following the link I see you are just using a <div class="tooltip"><span class="tooltiptext"></span></div>
inside the <th>
's.
查看数据表exportOptions
-> https://datatables.net/reference/api/buttons.exportData()您可以在导出表之前对其进行操作.一个简单的jQuery方法可能是
Look at DataTables exportOptions
-> https://datatables.net/reference/api/buttons.exportData() You can manipulate all parts of the table before it is exported. A simple jQuery approach could be
...
buttons: [
{
extend: 'pdfHtml5',
exportOptions: {
format: {
header: function (data) {
return $('<div></div>')
.append(data)
.find('.tooltip')
.remove()
.end()
.text()
}
}
}
}
},
{
extend: 'excelHtml5',
...and so on
}
],
...
这篇关于导出到文件时,忽略Jquery Datatables标头中的HTML的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!