为什么我的列值不出现在jQuery数据表导出中？

Question

我有这样的jquery数据表：

$(document).ready(function() {
$('#example1').DataTable( {

"fnRowCallback" : function(nRow, aData, iDisplayIndex){
            $("td:first", nRow).html(iDisplayIndex +1);
           return nRow;
        },
 "columnDefs": [ {
        "paging": true,
      "lengthChange": false,
      "searching": true,
      "ordering": true,
      "info": true,
      "autoWidth": true,
        "searchable": false,
        "orderable": false,
        "targets": 0
    } ],
 dom: 'lBfrtip',  
buttons: [
    'copyHtml5','excelHtml5','csvHtml5',pdfHtml5']
} );

在我的本地，它运作良好：

但如果我导出为pdfhtml5，excelhtml5和csv html，则不会显示列编号。

如何解决？使用html5显示导出数据表中的列编号？

Answer 1

fnRowCallback用于后期处理（即向内容添加其他样式或格式），并且只要显示一行就会被称为。

所以你在视觉上看到的第1列中的连续数字只是连续调用fnRowCallback的输出 - 基础数据永远不会改变，因此导出表时数据会丢失。如果您想操纵表的内容 - 因此更改是持久的 - 您必须通过API。

在多种解决方案中，您可以使用createdRow回调：

createdRow: function (row, data, index) {
  this.api().cell({ row:index, column:0 }).data(index+1)
}    

cell().data()持久更新基础数据;或者您可以利用render中的columnDefs方法：

columnDefs: [{
  targets: 0,
  autoWidth: true,
  searchable: false,
  orderable: false,
  render: function(data, type, row, info) {
     return parseInt(info.row)+1;
  }   
}]