Creating a Preview PDF for Print By Data (Using JSON)

Problem

You want to create a preview PDF using JSON data and a template as inputs.

Solution

The solution is to create a request using the following URI and method type and submit it to the server via the Content Creation REST service:

Create Preview PDF (By Data) (JSON)

/rest/serverengine/workflow/contentcreation/pdfpreview/{templateId}

POST

Example

HTML5

cc-preview-pdf-by-data-json.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Create Preview PDF (By Data) (JSON) Example</title>
        <script src="../../common/lib/js/jquery-3.4.1.min.js"></script>
        <script src="../../common/js/common.js"></script>
        <script src="js/cc-preview-pdf-by-data-json.js"></script>
        <link rel="stylesheet" href="../../common/css/styles.css">
    </head>
    <body>
        <h2>Content Creation Service - Create Preview PDF (By Data) (JSON) Example</h2>
        <form>
            <fieldset>
                <legend>Inputs</legend>
                <div>
                    <label for="datafile">JSON Data File:</label>
                    <input id="datafile" type="file" required>
                </div>
                <div>
                    <label for="template">Template ID/Name:</label>
                    <input id="template" type="text" placeholder="1234 or Filename" required>
                </div>
            </fieldset>
            <fieldset>
                <legend>Actions</legend>
                <div>
                    <input id="submit" type="submit" value="Submit">
                </div>
            </fieldset>
        </form>
    </body>
</html>

JavaScript/jQuery

cc-preview-pdf-by-data-json.js

/* Content Creation Service - Create Preview PDF (By Data) (JSON) Example */
(function ($, c) {
    "use strict";
    $(function () {

        c.setupExample();

        var jsonData = null;

        c.setupJsonDataFileInput($("#datafile"), function (data) { jsonData = data });

        $("form").on("submit", function (event) {

            event.preventDefault();
            if (!c.checkSessionValid()) return;

            var templateId  = $("#template").val();

            /* Create Preview PDF (By Data) (JSON) */
            $.ajax({
                type:        "POST",
                url:         "/rest/serverengine/workflow/contentcreation/pdfpreview/" + templateId,
                data:        JSON.stringify({ data: jsonData }),
                contentType: "application/json"
            })
                .done(function (response, status, request) {
                    c.displayStatus("Request Successful");
                    c.displayResult("Managed File ID", response);
                })
                .fail(c.displayDefaultFailure);
        });
    });
}(jQuery, Common));

Screenshot & Output

Usage

To run the example you first need to use the Browse button to select an appropriate JSON Data File to use as an input using the selection dialog box.

Next, you need to enter the Managed File ID or Name of your template (previously uploaded to the file store) into the appropriate text field.

Once the inputs are selected/entered, select the Submit button to create the preview PDF. When the response returns, a Managed File ID of the preview PDF (in the file store) will be displayed in the Results area.