Html表格到PDF我要格式化它(页码,第二页不好)

时间:2016-04-20 10:12:38

标签: javascript php html mysql jspdf

我有一个格式问题,我的html表的标题是在每一面(我可以与谁一起生活)但它看起来很可怕(图片吼叫)。 然后我不想在PDF文件中插入页码(我不知道该怎么做)。

我的Javascript

function makePDF() {
            var pdf = new jsPDF('l', 'pt', 'letter');
            source = $('#PDF')[0];

            specialElementHandlers = {
                '#bypassme': function(element, renderer) {
                    return true
                }
            };
            margins = {
                top: 80,
                bottom: 60,
                left: 40,
                width: 522
            };
            pdf.fromHTML(
                    source,
                    margins.left, 
                    margins.top, {
                        'width': margins.width, 
                        'elementHandlers': specialElementHandlers
                    },
            function(dispose) {
                    $Titel=document.getElementById('TitelPDF').value;

                    if(! $Titel==""){
                        document.getElementById("TitelPDF").style.borderColor="";
                        $TitelPDF=$Titel+'.pdf';
                        pdf.save($TitelPDF);
                    } else {
                        alert("Insert a Title");
                        document.getElementById("TitelPDF").style.borderColor="red";
                    }
            }
            , margins);
        }

我的html表(来自Mysql的值)

    <?php  $statement = $pdo->prepare("SELECT * FROM person");
                $statement->execute(array());

                echo '<style type="text/css"> table, td, th { width: 55em; border-collapse: collapse; 
                        background: white; color: black; border: 1px solid #333; } </style>';
                echo '<table id="table">';
                    echo'<thead>';
                        echo'<tr id="tr">';
                            echo "<th>". "Vorname". "</th>";
                            echo "<th>". "Nachname". "</th>";
                            echo "<th>". "Ortschaft". "</th>";
                            echo "<th>". "Tel_Mobil". "</th>";
                            echo "<th>". "Mail". "</th>";
                            echo "<th>". "AHV". "</th>";
                        echo "</tr>";                   
                    echo'</thead>';
                    echo'<tbody>';
                    while($row = $statement->fetch()) {
                        echo '<tr id="tr">';
                            echo "<td>". $row['Vorname']."</td>";
                            echo "<td>" .$row['Nachname']."</td>";
                            echo "<td>" .$row['Ortschaft']."</td>";
                            echo "<td>" .$row['Tel_Mobil']."</td>";
                            echo "<td>" .$row['Mail']."</td>";
                            echo "<td>" .$row['AHV']."</td>";
                    }
                        echo'</tr>';
                    echo'</tbody>';
                echo '</table><br>';

                echo '<form action="../html/Navigation.html" method="post"> <input type="Submit" name="zurück" value="zurück"> </form>';
            }
        ?>

我的PDF图片: create a view Page 1

1 个答案:

答案 0 :(得分:0)

更改makePDF功能的第2行
source = $('#PDF')[0];

到以下两行

source = $("content").innerHTML;
source += "<footer><div style='text-align:center;'>Page <span class=\"pageCounter\"></span>/<span class=\"totalPages\"></span></div></footer>";

或者你可以保持功能不变&amp;在您生成的表之后回显页脚部分,但在网页上显示不正确,尽管在PDF中添加了页码。