JSPDF-Autotableを使用してrowspan/colspanを使用してHTMLテーブルをPDFにエクスポートする方法

-1

rowspan/colspanを持つHTMLテーブルがあります。このテーブルをJSPDF-Autotableまたはpdfプラグインへの他のエクスポートを使用してpdfにエクスポートできますか？ボタンをクリックして、テーブル全体をダウンロード可能なpdfとしてエクスポートし、rowspanとcolspanをpdfで作成したテーブルに表示するボタンを作成したいとします。私のテーブルには、JSPDF-Autotableを使用してrowspan/colspanを使用してHTMLテーブルをPDFにエクスポートする方法

<html> 
    <head> 
     <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> 
     <title id='title'>HTML Page setup Tutorial</title> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.0.272/jspdf.debug.js"></script> 
<script src="https://rawgit.com/someatoms/jsPDF-AutoTable/master/dist/jspdf.plugin.autotable.js"></script> 

     <script type="text/javascript"> 
function myFunction() 
{ 

var doc = new jsPDF('p', 'pt'); 

    var res = doc.autoTableHtmlToJson(document.getElementById("my-table")); 
    doc.autoTable(res.columns, res.data, {startY: 40}); 
    doc.save("Report.pdf"); 
} 

</script> 
    </head> 
    <body> 
<table border='1' id="my-table"> 
<thead> 
<tr> 
     <th>A</th> 
     <th>B</th> 
     <th>C</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
<td rowspan='2'>D</td> 
<td colspan='2'>$100</td> 

</tr> 
<tr> 
<td >E</td> 
<td >F</td> 

</tr> 
</tbody> 
</table> 
    <button type="button" onclick="myFunction()">Click Me!</button> 
    </body> 
</html>

出典

2016-04-06 Jason

<tbody>に<thead>やコンテンツのヘッダーをラップ、あなたのテーブルのためのIdを追加しています。

<table id="my-table"> 
<thead> 
<tr> 
     <th>Month</th> 
     <th>Savings</th> 
     <th>Savings for holiday!</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
<td>January</td> 
    <td>$100</td> 
    <td rowspan="2">$50</td> 
</tr> 
</tbody> 
</table>

その後JSのテーブルからJSONデータを取得するためにautoTableHtmlToJson()メソッドを使用します。

var doc = new jsPDF('p', 'pt'); 

    var res = doc.autoTableHtmlToJson(document.getElementById("my-table")); 
    doc.autoTable(res.columns, res.data, {startY: 40});

出典

2016-04-08 21:47:09 Purushoth

私の編集したコードを参照してください。テーブルがpdfとして保存されるのは、rowspan/colspan ...の違いがあります。実際のテーブルはpdfとは異なります – Jason

JSPDF-Autotableを使用してrowspan/colspanを使用してHTMLテーブルをPDFにエクスポートする方法

答えて

関連する問題