Блог

Основываясь на следующей таблице, мне нужно экспортировать ее в файл PDF, заголовок имеет две строки в представлении, но в PDF имеет только одну. Я не знаю, пропустил ли я что-то. Есть идеи, как получить ту же таблицу в сгенерированном файле?

Таблица HTML: мне нужно показать заголовок (colspan и rowspan) в сгенерированном файле PDF.

 <table id="example" class="table table-bordered table-striped">
    <!-- Two rows in the header but only one in the PDF -->
    <thead> 
        <tr>
            <th rowspan="2">Name</th>
            <th colspan="2">HR Information</th>
            <th colspan="3">Contact</th>
        </tr>
        <tr>
            <th>Position</th>
            <th>Salary</th>
            <th>Office</th>
            <th>Extn.</th>
            <th>E-mail</th>
        </tr>
    </thead>
    <tfoot>
        <tr>
            <th>Name</th>
            <th>Position</th>
            <th>Salary</th>
            <th>Office</th>
            <th>Extn.</th>
            <th>E-mail</th>
        </tr>
    </tfoot>
    <tbody>
        <tr>
            <td>Tiger Nixon</td>
            <td>System Architect</td>
            <td>$320,800</td>
            <td>Edinburgh</td>
            <td>5421</td>
            <td>t.nixon@datatables.net</td>
        </tr>

            .
            .
            .

        <tr>
            <td>Donna Snider</td>
            <td>Customer Support</td>
            <td>$112,000</td>
            <td>New York</td>
            <td>4226</td>
            <td>d.snider@datatables.net</td>
        </tr>
    </tbody>
</table>
  

Скрипт

 $(document).ready(function(){
        $('#example').DataTable({
            dom: 'Bfrtip',
            buttons: [
                {
                    extend: 'pdfHtml5',
                    orientation: 'landscape',
                    pageSize: 'LETTER'
                },
                'print'                    
            ],

            "bLengthChange": true,
            "searching" : false,
            "info": false,
            "ordering": false,
            "paging" : true,
        })
    });