隐藏 div 导出数据表答案

【问题标题】：hide div export datatable隐藏 div 导出数据表
【发布时间】：2017-08-07 22:05:31
【问题描述】：

我正在尝试导出数据表，但其中有一个工具提示。这是带有进度条和进度条内的工具提示的数据表：

问题是当我将表格导出到 Excel 时，它有工具提示信息。像这样：

例如，我只希望它显示 100%。这里有我的php代码

<td>
  <div class="progress">
    <div class='<?=barra($institucional); ?>' role="progressbar" style="width:<?=$institucional;?>%">
      <?=$institucional;?>%
    </div>
    <div class="info" style="display: none;">
      <strong>Acción:</strong> <?=round($row['accion']/3,2);?>%<br>
      <strong>Eje:</strong> <?=round($row['eje']/3,2);?>%<br>
      <strong>Programa:</strong> <?=round($row['programa']/3,2);?>%<br>
    </div> 
  </div>

这是我创建工具提示的 Javascript 代码

$( ".progress" ).each(function() {
    var contenido = $(this).children('.info:hidden').html()
    $( this ).popover({title: "", content: contenido, html: true, placement: "left", trigger:'hover', container: 'body'}); 
  });

所以，我所有的进度条都有一个信息隐藏 div，其中包含工具提示的数据。但我不想导出该工具提示数据。

有什么想法吗？

【问题讨论】：

标签： javascript jquery datatables

【解决方案1】：

我认为你应该尝试使用datatables output format，下面是代码示例：

var buttonCommon = { exportOptions: {
                       format: {
                       body: function (data, row, column, node) {
                       // here you must get which column you want to change the data, it using number not column name, column number start from 0
                       return column === 5 ? 'your desired value' : data;
                    }
                }
            }
        };

$('#example').DataTable({
    ajax: "ajax_data.txt",
    columns: [
      { data: 'name' },
      { data: 'position' },
      { data: 'office' },
      { data: 'extn' },
      { data: 'start_date' },
      { data: 'salary' }
   ],
   dom: 'Bfrtip',
   buttons: [
      $.extend(true, {}, buttonCommon, {
        extend: 'csv'
      })
   ]
});

所以，当你点击导出按钮时，它会根据你想要的数据修改数据输出。

【讨论】：