jQuery Datatables如何使用行分组打印表?

几天我试图用行分组来实现dataTable打印视图,但仍然无法正常工作.. 🙁

我有一个dataTable,其中一列是隐藏的,该列是行分组的.与此示例相同:https://datatables.net/examples/advanced_init/row_grouping.html

我正在使用按钮扩展(https://datatables.net/extensions/buttons/)打印按钮.当我点击打印按钮时,我会看到我的dataTable的所有列,甚至一列也应该被隐藏.然后我使用了一个选项“columns”:“:visible”,只打印可见列,但它再次不好,因为缺少分组的行.

那么有谁知道如何在打印视图中使用行分组作为原始dataTable获取相同的表?

table = $('#vartTable').DataTable({
            "dom": "Bt",
            "paging": false,
            "fixedHeader": {   
                "headerOffset": -10
            },
            "autoWidth": false,
            "ordering": false,
            "data": data,
            "columns": [
                {"data": "path",},
                {
                    "data": "username",
                    "render": function(data, type, row) {
                        return '<a href="User-view.do?varId=' + row.id + '">' + row.username+ '</a>';
                    }
                },
                {
                    "data": "name",
                    "render": function (data, type, row) {
                        return row.name+ ' ' + row.surname;
                    }
                },
                {"data": "details"}
            ],
            "columnDefs": [{"visible": false, "targets": 0}],

            "buttons": [
                {
                    "extend": 'print',
                    "title": "",
                    "text": 'Print current page',
                    "autoPrint": false,
                    "exportOptions": {
                        "columns": ':visible',
                        "modifier": {
                            "page": 'current'
                        }
                    }
                }
            ],
            "drawCallback": function () {
                var api = this.api();
                var rows = api.rows({page: 'current'}).nodes();
                var last = null;

                api.column(0, {page: 'current'}).data().each(function (group, i) {
                    if (last !== group) {
                        $(rows).eq(i).before('<tr><td colspan="3" class="group">' + group + '</td></tr>');
                        last = group;
                    }
                });
            }
        });

最佳答案 Datatable中不支持导出行搜索功能.您必须在datatables.buttons.js文件中的__exportData函数中添加分组代码,以便在导出之前将分组行添加到数据中,如下所示

var grouped_array_index=config.grouped_array_index;                     //customised
    var no_of_columns = header.length;
    var no_of_rows = no_of_columns > 0 ? cells.length / no_of_columns : 0;
    var body = new Array( no_of_rows );
        var body_data = new Array( no_of_rows );                                //customised
        var body_with_nodes = new Array( no_of_rows );                          //customised
        var body_with_nodes_static = new Array( no_of_rows );                          //customised
    var cellCounter = 0;

    for ( var i=0, ien=no_of_rows ; i<ien ; i++ ) {
        var rows = new Array( no_of_columns );
                var rows_with_nodes = new Array( no_of_columns );
        for ( var j=0 ; j<no_of_columns ; j++ ) {
            rows[j] = config.format.body( cells[ cellCounter ], i, j, cellNodes[ cellCounter ] );
                        rows_with_nodes[j] = config.format.body( cellNodes[ cellCounter ], i, j, cells[ cellCounter ] ).outerHTML;
            cellCounter++;
        }
        body[i] = rows;
                body_data[i] = rows;
                body_with_nodes[i] = $.parseHTML('<tr class="even">'+rows_with_nodes.join("")+'</tr>');
                body_with_nodes_static[i] = $.parseHTML('<tr class="even">'+rows_with_nodes.join("")+'</tr>');
    }
        //console.log(dt.rows().nodes());
        /******************************************** GROUP DATA *****************************************************/
        var row_array=dt.rows().nodes();
        var row_data_array=dt.rows().data();
        var iColspan =no_of_columns;
        var sLastGroup = "";
        var inner_html='',grouped_index;
        var individual_group_array= new Array(),sub_group_array= new Array(),total_group_array= new Array();
        var no_of_splices=0;  //to keep track of no of element insertion into the array as index changes after splicing one element
        for ( var i=0, row_length=body_with_nodes.length ; i< row_length; i++ ){
            sub_group_array[i]= new Array();
            individual_group_array[i]= new Array();  
            var sGroup='';
            for(var k=0;k<grouped_array_index.length;k++){
                sGroup = sGroup+''+row_data_array[i][grouped_array_index[k]]+' ';
                inner_html=row_data_array[i][grouped_array_index[k]];
                grouped_index=k;
                individual_group_array[i][k]=row_data_array[i][grouped_array_index[k]];
                sub_group_array[i][k]=sGroup;
            }
            total_group_array[i]=sGroup;
            if ( sGroup !== sLastGroup ){
                var table_data=[];
                var table_data_with_node='';

                for(var $column_index=0;$column_index<iColspan;$column_index++){
                    if($column_index===0){
                        table_data_with_node+='<td style="border-left:none;border-right:none">'+inner_html+'</td>';
                        table_data[$column_index]=inner_html+" ";
                    }    
                    else{
                        table_data_with_node+='<td style="border-left:none;border-right:none"></td>';
                        table_data[$column_index]='';
                    }
                }

                body_with_nodes.splice(i+no_of_splices,0,$.parseHTML('<tr class="group group_'+grouped_index+' grouped-array-index_'+grouped_array_index[grouped_index]+'">'+table_data_with_node+'</tr>'));
                body_data.splice(i+no_of_splices,0,table_data);
                no_of_splices++;
                sLastGroup = sGroup;
            }
        }
点赞