感觉和导出数据表

问题描述

我正在使用引导程序数据表，

并且我正在尝试将数据表导出到excel

当我添加列过滤 *（this：）

    $('#dgv thead tr').clone(true).appendTo('#dgv thead');
    $('#dgv thead tr:eq(0) th').each(function (i) {
        var title = $(this).text();
        $(this).html('<input type="text" style="width:100%"  class="form-control form-control-sm" placeholder="Search ' + title + '" />');
        $('input',this).on('keyup change',function () {
            if (table.column(i).search() !== this.value) {
                table
                    .column(i)
                    .search(this.value)
                    .draw();
            }
        });
    });

当我尝试导出数据时，列名（标题）未显示

但是当我删除列过滤时，列名显示为正常，

有什么解决办法

这是我的脚本：

  <script>
        $(document).ready(function () {
            // Setup - add a text input to each footer cell
            $('#dgv thead tr').clone(true).appendTo('#dgv thead');
            $('#dgv thead tr:eq(0) th').each(function (i) {
                var title = $(this).text();
                $(this).html('<input type="text" style="width:100%"  class="form-control form-control-sm" placeholder="Search ' + title + '" />');
                $('input',function () {
                    if (table.column(i).search() !== this.value) {
                        table
                            .column(i)
                            .search(this.value)
                            .draw();
                    }
                });
            });

            var table = $('#dgv').DataTable({

                "ajax": {
                    "url": "/api/test","type": "GET","dataType": "json","dataSrc": "",},//export
            var buttons = new $.fn.dataTable.Buttons(table,{
                buttons: [
                    {

                        extend: 'copyHtml5',className: 'btn btn-outline-warning btnexport',exportOptions: {
                            columns: [1,2,3,4,5,6,7,8,9,10,11,12]
                        }
                    },{

                        extend: 'excelHtml5',exportOptions: {


                            columns: [1,{
                        extend: 'pdfHtml5',orientation: 'landscape',pageSize: 'LEgal',exportOptions: {

                            columns: [1,12]
                        }
                    }
                ]
            }).container().appendTo($('#buttons'));


        });
    </script>

解决方法

当我尝试导出数据时，列名（标题）未显示

但是当我删除列过滤时，列名显示为正常

您可以尝试将$('#dgv thead tr:eq(0) th')替换为$('#dgv thead tr:eq(1) th')，以将过滤器输入添加到表标题的第二行中，如下所示。

$('#dgv thead tr').clone(true).appendTo('#dgv thead');
$('#dgv thead tr:eq(1) th').each(function (i) {
    var title = $(this).text();
    $(this).html('<input type="text" style="width:100%"  class="form-control form-control-sm" placeholder="Search ' + title + '" />');
    $('input',this).on('keyup change',function () {
        if (table.column(i).search() !== this.value) {
            table
                .column(i)
                .search(this.value)
                .draw();
        }
    });
});