导出到 Excel 时更改数据表中的列标题

Question

我试图在导出到 excel 时重命名 dataTables 中的列。

原因是我在其中一个标题标题上添加了一个选择过滤器选项。

当我尝试导出它时，整个名称显示如下：

类别美容圣诞装饰食品 - 烘焙食品 - 熟食店 - 饮品花园礼品卡和文具礼品 - 儿童 - 服装礼品 - 儿童 - 玩具礼品 - 女士礼品 - 男士珠宝宠物

而不是仅仅说：类别

请帮忙！

我的代码：

$(document).ready(function () {


        $('#datatables').DataTable({

            "pagingType": "full_numbers",
            "lengthMenu": [
                [10, 25, 50, -1],
                [10, 25, 50, "All"]
            ],
            responsive: true,
            language: {
                search: "_INPUT_",
                searchPlaceholder: "Search records",
            },
            'columns': [         // see https://datatables.net/reference/option/columns.searchable
                null,
                null,
                null,
                null,
                null,
                {'searchable': false},
                {'searchable': false}
            ],


            dom: 'Bfrtip',
            buttons: [

                {
                    extend: 'excelHtml5',
                    orientation: 'landscape',
                    exportOptions: {
                        columns: [0, 1, 2, 3],
                        customize: function ( xlsx ) {
                            var sheet = xlsx.xl.worksheets['sheet1.xml'];

                            $('c[r=A2] t', sheet).text( 'Custom text' );
                        }


                        /**format: {
                            //this isn't working....
                            header: function (data, columnIdx) {
                                return columnIdx + ': ' + data;
                            }
                        }*/

                    }
                }
                /**,{
                    extend: 'pdfHtml5',
                    orientation: 'landscape',
                    exportOptions: {
                        columns: [ 0, 1, 2, 3 ],
                        header: false
                    }
                }*/

            ],

            //add drop downs to columns
            initComplete: function () {
                this.api().columns([3]).every(function () {
                    var column = this;
                    var select = $('<select><option value="">Category</option></select>')
                        .appendTo($(column.header()).empty())
                        .on('change', function () {
                            var val = $.fn.dataTable.util.escapeRegex(
                                $(this).val()
                            );

                            column
                                .search(val ? '^' + val + '$' : '', true, false)
                                .draw();
                        });

                    column.data().unique().sort().each(function (d, j) {
                        select.append('<option value="' + d + '">' + d + '</option>')
                    });
                });
            }

        });

        var table = $('#datatables').DataTable();

    });

我到处找，似乎找不到解决方案。

Answer 1

我有完全相同的问题。 我设法使用exportOptions对象内的header格式化函数而不是customize函数使其工作。 假设需要修改的标头是第一个，即标头索引为 0，您可以像这样编写标头函数以使其工作。

...
exportOptions: {
  format: {
    header: function ( data, columnIdx ) {
      return columnIdx === 0 ? "Category" : data;
    }
  }
},
...

参考： https : //datatables.net/extensions/buttons/examples/html5/outputFormat-function

Answer 2

我设法弄清楚自定义位置是错误的。

$(document).ready(function () {

        $('#datatables').DataTable({

            "pagingType": "full_numbers",
            "lengthMenu": [
                [10, 25, 50, -1],
                [10, 25, 50, "All"]
            ],
            responsive: true,
            language: {
                search: "_INPUT_",
                searchPlaceholder: "Search records",
            },
            'columns': [         // see https://datatables.net/reference  /option/columns.searchable
                null,
                null,
                null,
                null,
                null,
                {'searchable': false},
                {'searchable': false}
            ],

            dom: 'lBfrtip',
            buttons: [
                {
                    extend: 'excelHtml5',
                    text: 'Excel Export',
                    customize: function (xlsx) {
                        var sheet = xlsx.xl.worksheets['sheet1.xml'];

                        $('c[r=D2] t', sheet).text('Category');
                    },
                    exportOptions: {
                        columns: [0, 1, 2, 3],
                        modifier: {
                            page: 'current',

                        }
                    }

                }
            ],

            initComplete: function () {
                this.api().columns([3]).every(function () {
                    var column = this;
                    var select = $('<select><option value="">Category</option></select>')
                        .appendTo($(column.header()).empty())
                        .on('change', function () {
                            var val = $.fn.dataTable.util.escapeRegex(
                                $(this).val()
                            );

                            column
                                .search(val ? '^' + val + '$' : '', true, false)
                                .draw();
                        });

                    column.data().unique().sort().each(function (d, j) {
                        select.append('<option value="' + d + '">' + d + '</option>')
                    });
                });
            }

        });


        var table = $('#datatables').DataTable();

    });