导出时自定义数据 jQuery DataTable

Question

我在 Laravel 中使用 jQuery DataTables，我想使用插件的导出功能。

现在我的问题是，在我的 table 中，我有一些 HTML，所以我渲染了一个复选框，而不是实际的文本。

例子

<td>
    <span class="{{($r->submitted == 1)?'checkbox-checked':''}}">
        <i class="material-icons md-18">check_box</i>
    </span>
</td>

当我在 Excel 中导出此 table 时，我得到了 td 'check_box' 的值，所以 excel 看起来像这样

+-----------+----------+-----------+-----------+--+
| Firstname | Lastname | Option 1  | Option 2  |  |
+-----------+----------+-----------+-----------+--+
| Christos  | Savva    | check_box | check_box |  |
+-----------+----------+-----------+-----------+--+
| Second    | Person   | check_box | check_box |  |
+-----------+----------+-----------+-----------+--+
| Third     | Person   | check_box | check_box |  |
+-----------+----------+-----------+-----------+--+

显然这在 excel 文件中没有意义，而在屏幕上很好，因为我渲染了图标。

根据文档，我尝试使用 Format output data - export options

var buttonCommon = {
    exportOptions: {
        format: {
            body: function ( data, row, column, node ) {
                //Do stuff to replace check_box with word Yes
                //or no
                return data
            }
        }
    }
};

问题来了。当我从我的函数中 return 数据时，它 returns 整个 html 块在 td.

所以 excel 看起来像这样

+-----------+----------+---------------------------------------------------------------+---------------------------------------------------------------+--+
| Firstname | Lastname | Option 1                                                      | Option 2                                                      |  |
+-----------+----------+---------------------------------------------------------------+---------------------------------------------------------------+--+
| Christos  | Savva    | <span class="{{($r->submitted == 1)?'checkbox-checked':''}}"> | <span class="{{($r->submitted == 1)?'checkbox-checked':''}}"> |  |
|           |          |                                                               |                                                               |  |
|           |          | <i class="material-icons md-18">yes</i>                       | <i class="material-icons md-18">yes</i>                       |  |
|           |          |                                                               |                                                               |  |
|           |          | </span>                                                       | </span>                                                       |  |
+-----------+----------+---------------------------------------------------------------+---------------------------------------------------------------+--+
| Second    | Person   | <span class="{{($r->submitted == 1)?'checkbox-checked':''}}"> | <span class="{{($r->submitted == 1)?'checkbox-checked':''}}"> |  |
|           |          | <i class="material-icons md-18">yes</i>                       |                                                               |  |
|           |          | </span>                                                       | <i class="material-icons md-18">yes</i>                       |  |
|           |          |                                                               |                                                               |  |
|           |          |                                                               | </span>                                                       |  |
+-----------+----------+---------------------------------------------------------------+---------------------------------------------------------------+--+
| Third     | Person   | <span class="{{($r->submitted == 1)?'checkbox-checked':''}}"> | <span class="{{($r->submitted == 1)?'checkbox-checked':''}}"> |  |
|           |          |                                                               |                                                               |  |
|           |          | <i class="material-icons md-18">yes</i>                       | <i class="material-icons md-18">yes</i>                       |  |
|           |          |                                                               |                                                               |  |
|           |          | </span>                                                       | </span>                                                       |  |
+-----------+----------+---------------------------------------------------------------+---------------------------------------------------------------+--+

有谁知道我怎样才能做到这一点？

Answer 1

如果我们可以假设 HTML 已呈现。即 <span class="{{($r->submitted == 1)?'checkbox-checked':''}}"> 呈现为 <span class="checkbox-checked"> 或 <span class=""> :

exportOptions: {
  format: {
    body: function ( data, row, column, node ) {
      if (![2,3].indexOf(column)) {
        return $('span', data).hasClass('checkbox-checked')
          ? 'yes'
          : 'no'
      }
      return data
    }
  }    
}

导出时自定义数据 jQuery DataTable

Customize data when export jQuery DataTable

jquery

datatables

export-to-excel