jsPDFでHTMLフォームをPDFに変換

私は、ユーザーが部分的に入力するフォームを持っています。彼らはすべての選択肢を作ったら、そのページをそのままPDFにレンダリングし、それを電子メールで送信したいと思います。私はちょうどそれのチュートリアルと例の周りに私の頭を包んでいるように見えることはできません。現在、私は私の頭の部分jsPDFでHTMLフォームをPDFに変換

<script type="text/javascript" src="http://code.jquery.com/jquery-3.1.0.min.js"></script> 
<script type="text/javascript" src="http://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script> 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.0.272/jspdf.debug.js"></script>

で参照jQueryとjspdfを持っており、これが私の現在の関数のスクリプトです - 基本的には、ここで、他の場所

<script type="text/javascript"> 
$(function() { 
    var specialElementHandlers = { 
    '#editor': function (element,renderer) { 
     return true; 
    } 
}; 
$('#cmd').click(function() { 
    var doc = new jsPDF(); 
    doc.fromHTML($('#target').html(), 15, 15, { 
     'width': 170,'elementHandlers': specialElementHandlers 
     }); 
    }); 
     doc.output("dataurlnewwindow"); 
    }); 
    }); 
    </script>

次のページの数十に概説されているもの私は自分のフォームを起動して、私はその後、私はDIVを閉じ、PDを生成する必要があり、ボタンを持って、すべてのフォーム入力が続く

<body> 
<form action="" method="post"> 
<div id="target">

をレンダリングしたいページ全体を含むDIVを持っていますF

</div> 
<p> 
<button id="cmd">Generate PDF</button> 
</p> 
</form> 
</body> 
</html>

私は何も得られません。私が何をしたとしても。私が周りを遊んだのは、空白のページですが、コンテンツはありません。正しい方向に私を助けてくれるどんな助けも大変ありがとう！

出典

2016-09-20 UniCav

このスニペットはうまくいくようですが、これがあなたの望むものかどうかはわかりません。構文を修正し、doc変数をクリック機能内に移動しました。

空のPDFの問題については、https://github.com/MrRio/jsPDF/issues/130とhttps://github.com/MrRio/jsPDF/issues/270が役立ちます。

<html> 

<head> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-3.1.0.min.js"></script> 
    <script type="text/javascript" src="http://code.jquery.com/ui/1.11.4/jquery-ui.min.js"></script> 
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.0.272/jspdf.debug.js"></script> 
    <script type="text/javascript"> 
    $(function() { 
    var specialElementHandlers = { 
     '#editor': function(element, renderer) { 
      return true; 
     } 
    }; 
    $('#cmd').click(function() { 
     var doc = new jsPDF(); 
     doc.fromHTML($('#target').html(), 15, 15, { 
      'width': 170, 
      'elementHandlers': specialElementHandlers 
     }); 
     doc.output("dataurlnewwindow"); 
    }); 
    }); 
    </script> 
</head> 

<body> 
    <form action="" method="post"> 
     <div id="target"> 
     <input type="text" value="Nishant"/> 
     </div> 
     <p> 
      <button id="cmd">Generate PDF</button> 
     </p> 
    </form> 
</body> 

</html>

出典

2016-09-20 16:25:54 Nishant

それはPDFを作成しますが、それは空白です。私はhtml2canvasまたはrasterizeHTMLで掘り起こし、私がそれを動作させることができるかどうかを見なければならないでしょう。もともと私は元のPDFをPOST値とマージしようとしていましたが、何度か読んだ後、私はこのようにする方が簡単か効率が良いと思っていました。 – UniCav

wkhtmltopdf、weasyprintなどのようなサーバー側のソリューションがあります。ライセンスが必要な場合は、Prince XMLとPDF Reactorもあります。 – Nishant

私は多くの記事でも見ました。このすべての欠点はもちろん私はプログラマではないと私は一緒にこれをcobbleしていると私は何とかほとんどの時間を行うことができます例からリバースエンジニアリングする必要があります。これまでのところ、これは私が処理できる以上のものでした。ある日、機器をインストールしてからすべてのWebを書き直すことになってしまったキャッチオールITの男の不幸な副作用が次の形になります。 – UniCav

jsPDFでHTMLフォームをPDFに変換

答えて

関連する問題