изменить фон ячейки файла Excel в экспортируемом файле Excel для столбцов, имеющих желаемый класс

Question

Как изменить цвет фона ячейки файла Excel в экспорте таблиц данных для столбцов с нужным классом. Допустим, у меня есть имя класса = .error

В основном мне нужно выделить нужные ячейки, такие как изменив цвет фона в красный цвет файла Excel, который не проходит проверку. Но изо всех сил, как не знаю, как это сделать ..

например, я взял этот код ..

$(document).ready(function() {
        $('#example').DataTable({
            dom: 'Bfrtip',
            buttons: [{
                extend: 'excelHtml5',
                customize: function(xlsx) {
                    var sheet = xlsx.xl.worksheets['sheet1.xml'];
 
                // Loop over the cells in column `C`
                $('row c[r^="C"]', sheet).each( function () {
                    // Get the value
                    if ( $('is t', this).text() == 'New York' ) {
                        $(this).attr( 's', '20' );
                    }
                });
                }
            }]
        });
    });

<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
    <script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.1/js/dataTables.buttons.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.flash.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.html5.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.print.min.js"></script>
<table id="example" class="table">
                                            <thead>
                                                <tr class="bg-dark text-white">
                                                    <th>S.No</th>
                                                    <th>CID</th>
                                                    <th>Material Name</th>
                                                    <th>Category</th>
                                                    <th>Qty</th>
                                                    <th>Unit</th>
                                                    <th>Location</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr>
                                                    <td>1</td>
                                                    <td>CID-001</td>  
                                                    <td>Material Name-1</td>
                                                    <td>Category-1</td>
                                                    <td>6000</td>
                                                    <td>KG</td>
                                                    <td>Abu Dhabi</td>
                                                </tr>
                                                <tr>
                                                    <td class="error">2</td>
                                                    <td>CID-002</td>  
                                                    <td>New York</td>
                                                    <td>Category-2</td>
                                                    <td>6000</td>
                                                    <td>KG</td>
                                                    <td>Abu Dhabi</td>
                                                </tr>
                                                <tr>
                                                    <td>3</td>
                                                    <td>CID-003</td>  
                                                    <td>Material Name-3</td>
                                                    <td>Category-3</td>
                                                    <td>6000</td>
                                                    <td>KG</td>
                                                    <td>Abu Dhabi</td>
                                                </tr>
                                            </tbody>
                                        </table>

здесь я могу знать, что мы зацикливаемся на каждой ячейке листа 1 и проверяем, содержит ли ячейка текст «Нью-Йорк», поэтому, аналогично, я хочу знать, Как изменить цвет фона любой ячейки, которая имеет класс с именем .error

Answer 1

Спасибо! Я нашел решение ...

$(document).ready(function() {
        var output_table = $('#example').DataTable({
            dom: 'Bfrtip',
            buttons: [{
                extend: 'excelHtml5',
                customize: function(xlsx) {
                    var sheet = xlsx.xl.worksheets['sheet1.xml'];
                                        var row = 0;
                                        $('row', sheet).each(function (x) {
                                            if (x > 1) {
                                                for (var i = 0; i < 7; i++) {
                                                    if ($(output_table.cell(':eq(' + row + ')', i).node()).hasClass('error')) {
                                                        $('row:nth-child(' + (x + 1) + ') c', sheet).eq(i).attr('s', '10');
                                                    }
                                                }
                                                row++;
                                            }
                                        });
                }
            }]
        });
    });

<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
    <script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.1/js/dataTables.buttons.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.flash.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.html5.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.print.min.js"></script>
<table id="example" class="table">
                                            <thead>
                                                <tr class="bg-dark text-white">
                                                    <th>S.No</th>
                                                    <th>CID</th>
                                                    <th>Material Name</th>
                                                    <th>Category</th>
                                                    <th>Qty</th>
                                                    <th>Unit</th>
                                                    <th>Location</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr>
                                                    <td>1</td>
                                                    <td>CID-001</td>  
                                                    <td>Material Name-1</td>
                                                    <td>Category-1</td>
                                                    <td>6000</td>
                                                    <td>KG</td>
                                                    <td class="error">Abu Dhabi 1</td>
                                                </tr>
                                                <tr>
                                                    <td class="error">2</td>
                                                    <td>CID-002</td>  
                                                    <td class="error">New York</td>
                                                    <td>Category-2</td>
                                                    <td>6000</td>
                                                    <td>KG</td>
                                                    <td>Abu Dhabi 2</td>
                                                </tr>
                                                <tr>
                                                    <td>3</td>
                                                    <td class="error">CID-003</td>  
                                                    <td>Material Name-3</td>
                                                    <td>Category-3</td>
                                                    <td>6000</td>
                                                    <td>KG</td>
                                                    <td class="error">Abu Dhabi 3</td>
                                                </tr>
                                            </tbody>
                                        </table>

По этой ссылке -> https://datatables.net/forums/discussion/55877/how-to-set-excel-exports-cells-background-colors-by-table-cell-class

Answer 2

[UPADTE] Поскольку имя класса ячейки здесь не экспортируется в электронную таблицу, мы должны проанализировать содержимое листа и сравнить его по ссылкам на индексы ячеек в отрисованной таблице. Используя Datatables cell () в l oop.

Мы можем добавить атрибуты стиля к отрисованной электронной таблице XML, следуя excel Html5 Guidelines , где обычный текст с красным фоном будет ссылаться на $(this).attr('s', '10'); в качестве предопределенного атрибута стиля, равного 10.

$(document).ready(function() {
columns=$("table").find("th").length; //Count Columns
var table=$('#example').DataTable({
    dom: 'Bfrtip',
    buttons: [{
        extend: 'excelHtml5',
        customize: function( xlsx ) {

var sheet = xlsx.xl.worksheets['sheet1.xml'];

//console.log(sheet);
var row = 0;

$('row', sheet).each(function(x) {
//The xml file' data begins after Raw 2. Usually The first is the for the Document' title
//And the Second for the headers 
if (x > 2) {
    for(var i=0; i<columns; i++) {
    //to avoid using the ":eq() Selector" being deprecated in the latest jQuery versions
        if ($(table.cell(row, i).node()).hasClass('error')) {
        //C is the cell tag like (td) and S is the styling attribute
          $('row:nth-child('+(x)+') c', sheet).eq(i).attr('s', '10');                 
        } 
    }

    row++;
}

});

}
    }]
});
});

<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
    <script src="https://cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.1/js/dataTables.buttons.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.flash.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/pdfmake.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.53/vfs_fonts.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.html5.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/1.6.1/js/buttons.print.min.js"></script> 
    <table id="example" class="table">
                                            <thead>
                                                <tr class="bg-dark text-white">
                                                    <th>S.No</th>
                                                    <th>CID</th>
                                                    <th>Material Name</th>
                                                    <th>Category</th>
                                                    <th>Qty</th>
                                                    <th>Unit</th>
                                                    <th>Location</th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr>
                                                    <td>1</td>
                                                    <td>CID-001</td>  
                                                    <td>Material Name-1</td>
                                                    <td>Category-1</td>
                                                    <td>6000</td>
                                                    <td>KG</td>
                                                    <td>Abu Dhabi</td>
                                                </tr>
                                                <tr>
                                                    <td class="error">2</td>
                                                    <td>CID-002</td>  
                                                    <td>New York</td>
                                                    <td>Category-2</td>
                                                    <td>6000</td>
                                                    <td>KG</td>
                                                    <td>Abu Dhabi</td>
                                                </tr>
                                                <tr>
                                                    <td>3</td>
                                                    <td>CID-003</td>  
                                                    <td>Material Name-3</td>
                                                    <td>Category-3</td>
                                                    <td>6000</td>
                                                    <td>KG</td>
                                                    <td>Abu Dhabi</td>
                                                </tr>
                                            </tbody>
                                        </table>

К сожалению, мы не можем вывести электронную таблицу Xml в редакторе фрагментов StackOverflow. Так что это ссылка на Raw Xml формат . Это может помочь в качестве ссылки на имена тегов, используемые этой библиотекой.