DocRaptor

Documentation

HTML-to-PDF with jQuery

Test API Key: YOUR_API_KEY_HERE

Code Examples

jQuery & JavaScript

The DocRaptor JavaScript library makes it easy to create PDFs with JavaScript. The library does not require jQuery, but you can use jQuery to define your document content. When a PDF is requested, the library constructs a hidden form and submits it to the DocRaptor API. Until all modern browsers support the download link attribute, using this hidden form is the best way to generate a file download directly from JavaScript.

Warning: This code exposes your API key in your website source code. This code should not be used in a publicly-accessible location, instead try using a server-side agent such as PHP or Ruby.

Example Code


<head>
  <script src="https://docraptor.com/docraptor-1.0.0.js"></script>
  <script>
    var downloadPDF = function() {
      DocRaptor.createAndDownloadDoc("YOUR_API_KEY_HERE", {
        test: true, // test documents are free, but watermarked
        type: "pdf",
        document_content: document.querySelector('html').innerHTML, // use this page's HTML
        // document_content: "<h1>Hello world!</h1>",               // or supply HTML directly
        // document_url: "http://example.com/your-page",            // or use a URL
        // javascript: true,                                        // enable JavaScript processing
        // prince_options: {
        //   media: "screen",                                       // use screen styles instead of print styles
        // }
      })
    }
  </script>
  <style>
    @media print {
      #pdf-button {
        display: none;
      }
    }
  </style>
</head>
<body>
  <h1>Example!</h1>
  <input id="pdf-button" type="button" value="Download PDF" onclick="downloadPDF()" />
</body>








Converting HTML into PDF and XLS documents with jQuery is fast and painless with DocRaptor. Just POST to our Docs API with your HTML content and some required parameters, either as a form serialized string or a JSON object.

Below you’ll find complete examples for jQuery, but our API Reference Guide has all the details about the complete workings of the Docs API.

Circledoc@2x

With DocRaptor, your PDF content is HTML and its style is CSS - things you already know! Even still, it can be difficult to get your PDF to look just right. Check out our Style and Formatting Documentation for everything related getting a perfectly styled PDF!