数据表未在Excel和Pdf页面上显示主标题

时间:2019-02-24 06:53:38

标签: javascript jquery html datatable datatables

我已经初始化了数据表,它看起来像:

enter image description here

它具有使用colspan的标题和子标题。

但是当我单击PDF或EXCEL按钮时,该表被下载,但数据表的主标头(自定义,增值税,消费税)消失了:

enter image description here

我试图寻找其他解决方案,但没有找到相关的答案。

我想在按下按钮时将标题和子标题一起显示。 如何在我下载的pdf和excel文件中添加标题和子标题?

$(document).ready(function() {
    $('#myTable').DataTable( {
     dom: 'Bfrtip',
        buttons: [
            
            'excelHtml5',
           
            'pdfHtml5'
        ]
} );
} );
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
 <script src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
  <script src="  https://cdn.datatables.net/1.10.19/js/jquery.dataTables.min.js"></script>
        <script src="https://cdn.datatables.net/buttons/1.5.2/js/dataTables.buttons.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.36/pdfmake.min.js"></script>

        <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.36/vfs_fonts.js"></script>

        <script src="
https://cdn.datatables.net/buttons/1.5.2/js/buttons.html5.min.js"></script>

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
 
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css">
	<title></title>
    <link href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.min.css
">
    <link href="https://cdn.datatables.net/buttons/1.5.2/css/buttons.dataTables.min.css">
</head>
<body>
    <div class="container">
<table id="myTable" class="display compact" style="width: 100%">
    <thead>
        <tr>
            <th rowspan="2">EXIM</th>
            <th rowspan="2">Name</th>
            <th rowspan="2">Selection</th>
            <th rowspan="2">Auditor</th>
            <th rowspan="2" class="tcol1" name="tcol1" id="tcol1">Pre Assessment Date</th>

            <th colspan="2">VAT</th>
            <th colspan="2">Excise</th>
            <th colspan="2">Customs</th>
            <th colspan="2">Others</th>
        </tr>
        <tr>
            <th>Amt.</th>
            <th>Pen.</th>
            <th>Amt.</th>
            <th>Pen.</th>
            <th>Amt.</th>
            <th>Pen.</th>
            <th>Amt.</th>
            <th>Pen.</th>
        </tr>
    </thead>
    <tbody>

        <tr>
            <td class="sorting_1">1234567Np</td>
            <td>sunmicrosoft</td>
            <td>16</td>
            <td>AA</td>
            <td>2072-01-01</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
            <td>6</td>
            <td>1</td>
            <td>2</td>
            <td>7</td>
            <td>8</td>
        </tr>
        <tr>
            <td>4588735NP</td>
            <td>ASAT Holdings Ltd.</td>
            <td>3</td>
            <td>GG</td>
            <td>2071-01-01</td>
            <td>99</td>
            <td>2</td>
            <td>999</td>
            <td>3</td>
            <td>1</td>
            <td>1</td>
            <td>89</td>
            <td>4</td>
        </tr>
    </tbody>
</table>
        </div>
</body>
    

</html>

0 个答案:

没有答案