2016-03-08 4 views
-1

пытаюсь преобразовать мой HTML таблицу в формате PDF с использованием pdfmake http://pdfmake.org/, но я не могу это сделать, как использоватьКак конвертировать HTML таблицу в формате PDF с использованием pdfmake

<!DOCTYPE html> 
<html> 
<?php $pdffile = md5(time()).'.pdf'; ?> 
<script src="jquery-1.7.2.min.js" type="text/ecmascript"></script> 
<script src="pdfmake.min.js" type="text/javascript"></script> 
<script src="vfs_fonts.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    $(document).ready(function(e) { 
      var table = document.getElementById('table').outerHTML; 
      var table = document.getElementById('table').innerHTML; // Same response with outerHTML 
      var table = document.getElementById('table').value; // nothing is happening here 
     docDefinition = { 
      content: table 
     } 
     pdfMake.createPdf(docDefinition).download('<?php print $pdffile; ?>'); 
    }); 
</script> 
<?php 
    $con = mysqli_connect('localhost','root','','db'); 
    if($con){ 
     echo 'connected'.'<br/>'; 

     $query = "SELECT * FROM user"; 
     $query_db = mysqli_query($con,$query); 
     if(mysqli_num_rows($query_db) > 0){ 
?> 
     <table cellpadding="0" cellspacing="0" border="1" id="table"> 
      <thead> 
       <tr> 
        <th>ID</th> 
        <th>Name</th> 
        <th>Email</th> 
       </tr> 
      </thead> 
      <tbody> 
       <?php while($data = mysqli_fetch_array($query_db)): ?> 
       <tr> 
        <td><?php print $data['user_id']; ?></td> 
        <td><?php print $data['username']; ?></td> 
        <td><?php print $data['email']; ?></td> 
       </tr> 
       <?php endwhile; ?> 
      </tbody>   
     </table> 
<?php   

     }else echo 'not data'; 
    }else echo 'error'; 
?> 
</html> 

Из кода я разместил я получаю HTML код а не html-таблицу на моем pdf-файле в любом случае извините, я не очень хорошо разбираюсь в javascript?

+0

Нам нужен способ больше информации, чем этот. Не могли бы вы попытаться объяснить, какой результат вы видите и ожидаете? На данный момент это не имеет большого смысла. – DevDonkey

+0

devdonkey, когда pdf создается, я получаю код, а не таблицу – SyntaxError

+0

Я думаю, что здесь уже был дан ответ [http://stackoverflow.com/questions/34049956/generate-pdf-from-html-using-pdfmake-in-angularjs] (http://stackoverflow.com/questions/34049956/generate-pdf-from-html-using-pdfmake-in-angularjs) – Bogdan

ответ

0

Ниже приведен правильный синтаксис, чтобы передать данные таблицы: -

var docDefinition = { 
    content: [ 
{ 
    table: { 


    body: [ 
     [ 'First', 'Second', 'Third', 'The last one' ], 
     [ 'Value 1', 'Value 2', 'Value 3', 'Value 4' ], 
     [ { text: 'Bold value', bold: true }, 'Val 2', 'Val 3', 'Val 4' ] 
    ] 
    } 
} 

] };

Это напечатает таблицу HTML, а не код html в файле pdf. Вам необходимо передать данные таблицы в этом формате.

+0

Bhawana, эй, вы имеете в виду после того, как я зациклил свою таблицу для просмотра пользователем, я должен также зацикливать ее на загрузку pdf? – SyntaxError

+0

Да, вам нужно создать функцию javascript, чтобы поместить данные таблицы в требуемый формат. – Webdev

+0

Вы можете ссылаться на более раннюю публикацию для этого http://stackoverflow.com/questions/31610129/pdfmake-html-table-to-pdfmake-table – Webdev

1

1.Вы не можете поместить таблицу HTML в содержимое объекта определения документа при использовании PDFMAKE 2. Что вам нужно сделать, это создать массив массивов. Основной массив - массив тела в объекте таблицы в объекте определения документа. Теперь извлеките каждую строку вашей таблицы html и перетащите каждую ячейку (по строке) в массив ... после завершения строки и всех данных соты конкретных строка вставляется в массив тела. Это нужно сделать для всех строк. Вот так! Простым примером является

<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/pdfmake/0.1.20/pdfmake.min.js'></script> 
     <script src='https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.1.20/vfs_fonts.js'></script> 
     <script type="text/javascript"> 

    function myFunction() 
    { 


     var docDefinition = { 
    content: [ 
{ 
    table: { 


    body: [ 
     [ 'First', 'Second', 'Third', 'The last one' ], 
     [ 'Value 1', 'Value 2', 'Value 3', 'Value 4' ], 
     [ { text: 'Bold value', bold: true }, 'Val 2', 'Val 3', 'Val 4' ] 
    ] 
    } 
}]} 
    pdfMake.createPdf(docDefinition).download('Report.pdf'); 

    } 
    </script> 
    </head> 
<body> 

<button type="button" onclick="myFunction()">Click Me!</button> 
</body> 
</html> 
Смежные вопросы