隐藏div export datatable

时间:2017-08-07 22:05:31

标签: javascript jquery datatables

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

Tooltip Demo

问题是当我将表导出到Excel时,它有工具提示信息。像这样: enter image description here

我只想让它显示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,其中包含工具提示的数据。但我不想导出该工具提示数据。

有什么想法吗?

1 个答案:

答案 0 :(得分:0)

我认为您应该尝试使用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'
      })
   ]
});

因此,当您单击导出按钮时,它将根据您所需的数据修改数据输出。