如何从数据表中导出非文本内容

How to export non-text content from a Datatable

我正在尝试导出我的数据表的内容,但列状态未导出,因为它不是文本。

到目前为止我尝试过的:

LIVE DATATABLES

基本上我试过像这样使用 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 的示例,您可以将其应用于按钮:copyHtml5csvHtml5pdfHtml5

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'
        } ),
        
    ]
} );

});