使用单元格颜色导出 jQuery 数据表数据

Posted 2023-05-09

【中文标题】使用单元格颜色导出 jQuery 数据表数据

【英文标题】：Exporting jQuery datatable data with cell colors

【发布时间】：2015-09-07 15:58:03

【问题描述】：

我正在使用 TableTools 以不同格式（如 excel、pdf）从 jQuery 数据表中导出数据。某些单元格在数据表中具有不同的背景颜色。但是这些颜色没有显示在导出的 excel 或 pdf 中。谁能告诉我，如何解决这个问题？

这是数据表的代码：

var wdm_without_groupcode_attendee_table = jQuery("#wdm_without_groupcode_attendee_table").DataTable(
    "dom": 'CT<"clear">lfrtip',
            "tableTools": 
                        "sSwfPath": wdm_new_reports_localize_data.wdm_swf_path , //Getting path from localize script
                        "aButtons": [ 
                                    
                                        "sExtends": "copy",         
                                        "oSelectorOpts":  filter: "applied", order: "current" 
                                    ,
                                    
                                        'sExtends': 'xls',         
                                        "oSelectorOpts":  filter: 'applied', order: 'current' 
                                    ,
                                    
                                        'sExtends': 'print',               
                                        "oSelectorOpts":  filter: 'applied', order: 'current' 
                                    ,
                                    
                                        'sExtends': 'pdf',               
                                        "oSelectorOpts":  filter: 'applied', order: 'current' 
                                    ,
                                    
                                        'sExtends': 'csv',     
                                        "oSelectorOpts":  filter: 'applied', order: 'current' 
                                    ]
                        ,
            "aoColumns": [
                    sClass: "alignLeft",
                    sClass: "alignLeft",
                    sClass: "alignCenter",
                    sClass: "alignCenter",
                    sClass: "alignCenter",
                    sClass: "alignCenter",
                    sClass: "alignCenter",
                    sClass: "alignCenter",
                    sClass: "alignLeft",
                    sClass: "alignCenter",
                    sClass: "alignCenter"
                    ],
            "createdRow": function ( row, data, index ) 


                jQuery('td',row).eq(4).addClass('DARK_BLUE');
                jQuery('td',row).eq(5).addClass('ORANGE');
                jQuery('td',row).eq(6).addClass('RED');

                //to decide color of cells
                if ( data[2].toLowerCase().indexOf("yes") >= 0 ) 
                    jQuery('td', row).eq(2).addClass('SKY_BLUE');
                
                if ( data[3] >= 1 ) 
                    jQuery('td', row).eq(3).addClass('DARK_BLUE');
                
                if ( data[7].toLowerCase().indexOf("yes") >= 0 ) 
                    jQuery('td', row).eq(7).addClass('DARK_BLUE');
                
            
);

【问题讨论】：

请分享您到目前为止所做的代码？以便有人可以为您修改

谢谢@Panther.. 我已经添加了数据表的代码。

【参考方案1】：

我不确定，但看起来您在完全创建 TR 之后为 TDs 着色 所以试试这个createdCell吧。

"aoColumns": [
    sClass: "alignLeft",
    sClass: "alignLeft", createdCell: function (td, cellData, rowData, row, col) 
        if (cellData >= 1 )
            $(td).addClass('DARK_BLUE');
    ,
    sClass: "alignCenter", createdCell: function (td, cellData, rowData, row, col) 
        if (cellData.toLowerCase().indexOf("yes") >= 0 )
            $(td).addClass('SKY_BLUE');
    ,
    sClass: "alignCenter DARK_BLUE",
    sClass: "alignCenter ORANGE",
    sClass: "alignCenter RED",
    sClass: "alignCenter", createdCell: function (td, cellData, rowData, row, col) 
        if (cellData >= 1 )
            $(td).addClass('DARK_BLUE');
    ,
    sClass: "alignCenter",
    sClass: "alignLeft",
    sClass: "alignCenter",
    sClass: "alignCenter"
],

【讨论】：

感谢@JAG 的回答。您的解决方案为表格单元格添加颜色，但在从表格中导出该数据时，它不会将这些颜色添加到 pdf 或 xls。

【参考方案2】：

为了在导出的文件中应用单元格颜色，您需要在自定义方法中添加着色逻辑。

customize: function(xlsx) 
    var sheet = xlsx.xl.worksheets['sheet1.xml'];
    //color headers
    $('row:first c', sheet).attr('s', '42');

Adding header cell color