Как экспортировать таблицу HTML с rowspan/colspan в pdf с использованием JSPDF-Autotable

-1

У меня есть таблица HTML с rowspan/colspan. Как я могу экспортировать эту таблицу в pdf, используя JSPDF-Autotable/или любой другой экспорт в pdf-плагин? Я хочу создать кнопку, которая при нажатии экспортирует всю таблицу в виде загружаемого pdf-файла с rowspan и colspan, видимых в таблице, созданной в pdf. Моя таблицаКак экспортировать таблицу HTML с rowspan/colspan в pdf с использованием JSPDF-Autotable

<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

Id Добавить для таблицы, завернуть заголовки в <thead> и содержание в <tbody>.

<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 использовать autoTableHtmlToJson() метод, чтобы получить данные в формате JSON из таблицы.

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

Как экспортировать таблицу HTML с rowspan/colspan в pdf с использованием JSPDF-Autotable

ответ

Смежные вопросы