首页 > 解决方案 > 如果表数据是动态的并且可能最多两个维度,如何将 rowspan 和 colspan 与数据表一起使用?

问题描述

我在 laravel 项目中使用数据表。需要从数据库中获取记录,可能最多两个维度。如何使用 rowspan 或 colspan 使记录类别组具有分页和 pageLength 功能?

这个项目在 laravel 框架 5.5 上工作。php >=7.0 版本和 MySQL 5.0.

我也尝试过数据表的rowGroup。但它有一些限制,例如:

var table = $('#report-employee-table').DataTable({
    pageLength: 20,
    processing: true,
    serverSide: true,
    bLengthChange: false,
    dom: 'Blfrtip',
    buttons: [{
            extend: 'excelHtml5',
            "text": '<span class="glyphicons glyphicons-file_export"></span> &nbsp; Export',
            "title": 'Employee Report',
            "message": 'Employee Name: ' + $('#employee_id option:selected').text() + '      Work Duration: ' + $('#report_date').val(),
            "filename": 'employee-report',
            header: true,
            footer: true,
            exportOptions: {
                modifier: {
                    selected: true
                }
            },
            customize: function (xlsx) {
                var sheet = xlsx.xl.worksheets['sheet1.xml'];
                // s = for styling and 5 will make it left align with grey background
                $('row:first c', sheet).attr('s', '5');
            }
        },
        {
            extend: 'print',
            "text": '<span class="fa fa-print"></span> &nbsp; Print',
            "title": 'Employee Report',
            "message": 'Employee Name: ' + $('#employee_name option:selected').text() + '      Work Duration: ' + $('#report_date').val(),
            "filename": 'employee-report',
            header: true,
            footer: true,
            exportOptions: {
                modifier: {
                    selected: true
                }
            }
        }
    ],
    ajax: {
        url: "/*URL of controller where function return data in json format*/",
        data: function (d) {
            d.employee_name = $('#employee_name').val();
            d.report_date = $('#report_date').val();
        }
    },
    columns: [
        //{data: 'DT_Row_Index', name: 'DT_Row_Index'},
        {
            data: 'project_name',
            name: 'project_name'
        },
        {
            data: 'work_type_name',
            name: 'work_type_name'
        },
        {
            data: 'total_hour',
            name: 'total_hour'
        },
    ],
    rowsGroup: ['project_name:name', 0],
    footerCallback: function (row, data, start, end, display) {
        var api = this.api();

        var aCol = api.column(2);

        var foo = aCol.data(); //is empty!

        $(aCol.footer()).html(

        );
    },
});

标签: phplaraveldatatable

解决方案


推荐阅读