Excel Export with Background-Color from Table

Excel Export with Background-Color from Table

VisionstarVisionstar Posts: 7Questions: 1Answers: 0
edited September 2015 in Free community support

Hello,

i wanted to use 'Buttons' for Exporting my Table to Excel/PDF - this works so far.
But i can't add the background-colors, which i used in my table, to the exported Excel.
The Export with the PDF-File works already with colors ( i added the customize-function), but this doesn't work for Excel-Exports, because there is no definition of the customize-function.

Is there any solution, how to add Background-Colors to the exported excel-file?

This is my code:

The data for the Table is loaded via Ajax-Request (JSON) - creation of the table works
HTML for Table:
<table id="table_occurrences" class="display table table-striped table-hover table-condensed"> <thead> <tr> <th>Ereignis-Nr</th> <th>Erfassungszeit</th> <th>Ereignisart</th> <th>Status</th> <th>Bemerkung</th> <th class="warranty">Gewährleistung</th> <th>edit</th> </tr> </thead> </table>

JS-Initialisation of dataTables:

$("#table_occurrences").DataTable({
                "dom": '<"clear"Bl>frtip',

                buttons: [
                    {
                        extend: 'pdf',
                        customize: function (win) {
                            console.log(win);
                            var tblBody = win.content[1].table.body;
                            $("#table_occurrences").find('tr').each(function (ix, row) {
                                var index = ix;
                                var rowElt = row;
                                $(row).find('th,td').each(function (ind, elt) {
                                    if (elt.tagName === "TH") return;
                                    if (tblBody[index][ind].text == "in Bearbeitung") {
                                        tblBody[index][ind].fillColor = "#FFA500";
                                    } else if (tblBody[index][ind].text == "erledigt") {
                                        tblBody[index][ind].fillColor = "#7CFC00";
                                    }
                                });
                            });
                        }
                    }, {
                        extend: 'excel',
                        customize: function (win) {
                            console.log(win);

                            var tblBody = win.content[1].table.body;
                            $("#table_occurrences").find('tr').each(function (ix, row) {
                                var index = ix;
                                var rowElt = row;
                                $(row).find('th,td').each(function (ind, elt) {
                                    if (elt.tagName === "TH") return;
                                    if (tblBody[index][ind].text == "in Bearbeitung") {
                                        tblBody[index][ind].fillColor = "#FFA500";
                                    } else if (tblBody[index][ind].text == "erledigt") {
                                        tblBody[index][ind].fillColor = "#7CFC00";
                                    }
                                });
                            });
                        }
                    },
                    'csv'
                ],
                "ajax": {
                    "url": "api/occurrence/getAll?type=json&idRealEstate=" + idRealEstate,
                    "dataSrc": ""
                },
                "columnDefs": [
                {
                    "targets": -1,
                    "render": function (data, type, full, meta) {
                        return renderEditButton(data, 'Occurrence');
                    }
                },
                {
                    "targets": [5],
                    "render": function (data, type, full, meta) {
                        if (data == true) {
                            return '<a class="flag"><i class="fa fa-check fa-lg" style="color:lightgreen;"></i></a>';
                        } else {
                            return "";
                        }
                    }
                }],
                "columns": [
                    { "data": "occurrence_nr" },
                    { "data": "date_created" },
                    { "data": "occurrence_type.name" },
                    { "data": "occurrence_status.name" },
                    { "data": "note" },
                    { "data": "has_warranty" },
                    { "data": null }
                ],
                "createdRow": function ( row, data, index ) {
                    if ( data.occurrence_status.name == "erledigt" ) {
                        $('td', row).eq(3).addClass('highlightGreen');
                    } else if (data.occurrence_status.name == "in Bearbeitung") {
                        $('td', row).eq(3).addClass('highlightYellow');
                    } else {
                        $('td', row).eq(3).addClass('highlightRed');
                    }
                },
                "lengthMenu": [[20, 50, 100, 200, 500], [20, 50, 100, 200, 500]],
                "initComplete": null
            });

sorry for the bad formatting, the snippet doesn't work like it should

Kind Regards,
Edvin

This discussion has been closed.