如何从数据表中导出非文本内容
How to export non-text content from a Datatable
我正在尝试导出我的数据表的内容,但列状态未导出,因为它不是文本。
到目前为止我尝试过的:
基本上我试过像这样使用 HTML5 导出按钮插件:
dom: 'Bfrtip',
buttons: [
'copyHtml5',
'excelHtml5',
'csvHtml5',
'pdfHtml5'
]
理想情况下,我希望在导出内容时,绿色方块替换为文本 'Active',红色方块替换为文本 'Inactive' 或其他字符串。
您应该参考数据表文档中的 button.exportData()。
根据文档,您可以通过自定义按钮属性来自定义您喜欢的数据,可以这样做:
var DT1 = $('#example').DataTable({
...,
buttons: [
{
extend: 'excelHtml5',
exportOptions: {
format: {
body: function (data, rowIdx, colIndex, cellNode) {
const statusColumn = $(cellNode).find('div')
if (statusColumn.length > 0) {
return statusColumn.is('.status-active') ? 'Active' : 'Inactive'
}
return $(cellNode).text()
}
}
},
},
]
})
以上代码是 excelHtml5
的示例,您可以将其应用于按钮:copyHtml5
、csvHtml5
、pdfHtml5
。
此 link
中的完整代码
更新:
您可以使用.text()方法获取匹配元素集合中每个元素的组合文本内容,包括它们的后代。像这样$(cellNode).text()
请打开这个工作密码本click here
$(document).ready(function() {
var buttonCommon = {
exportOptions: {
format: {
body: function ( data, row, column, node ) {
// Strip $ from salary column to make it numeric
if(column === 2){
var txt = $(node).html();
if(txt.indexOf("status-active") > 0){
data = 'Active';
}
if(txt.indexOf("status-inactive") > 0){
data = 'In Active';
}
}
return data;
}
}
}
};
$('#example').DataTable( {
columns: [
{ data: 'name' },
{ data: 'position' },
{ data: 'office' },
{ data: 'age' },
{ data: 'start_date' },
{ data: 'salary' }
],
dom: 'Bfrtip',
buttons: [
$.extend( true, {}, buttonCommon, {
extend: 'excelHtml5'
} ),
]
} );
});
我正在尝试导出我的数据表的内容,但列状态未导出,因为它不是文本。
到目前为止我尝试过的:
基本上我试过像这样使用 HTML5 导出按钮插件:
dom: 'Bfrtip',
buttons: [
'copyHtml5',
'excelHtml5',
'csvHtml5',
'pdfHtml5'
]
理想情况下,我希望在导出内容时,绿色方块替换为文本 'Active',红色方块替换为文本 'Inactive' 或其他字符串。
您应该参考数据表文档中的 button.exportData()。
根据文档,您可以通过自定义按钮属性来自定义您喜欢的数据,可以这样做:
var DT1 = $('#example').DataTable({
...,
buttons: [
{
extend: 'excelHtml5',
exportOptions: {
format: {
body: function (data, rowIdx, colIndex, cellNode) {
const statusColumn = $(cellNode).find('div')
if (statusColumn.length > 0) {
return statusColumn.is('.status-active') ? 'Active' : 'Inactive'
}
return $(cellNode).text()
}
}
},
},
]
})
以上代码是 excelHtml5
的示例,您可以将其应用于按钮:copyHtml5
、csvHtml5
、pdfHtml5
。
此 link
中的完整代码更新:
您可以使用.text()方法获取匹配元素集合中每个元素的组合文本内容,包括它们的后代。像这样$(cellNode).text()
请打开这个工作密码本click here
$(document).ready(function() {
var buttonCommon = {
exportOptions: {
format: {
body: function ( data, row, column, node ) {
// Strip $ from salary column to make it numeric
if(column === 2){
var txt = $(node).html();
if(txt.indexOf("status-active") > 0){
data = 'Active';
}
if(txt.indexOf("status-inactive") > 0){
data = 'In Active';
}
}
return data;
}
}
}
};
$('#example').DataTable( {
columns: [
{ data: 'name' },
{ data: 'position' },
{ data: 'office' },
{ data: 'age' },
{ data: 'start_date' },
{ data: 'salary' }
],
dom: 'Bfrtip',
buttons: [
$.extend( true, {}, buttonCommon, {
extend: 'excelHtml5'
} ),
]
} );
});