Cart Buy Licenses Contact Integrate into App Docs Support Login/Register
v 1.9.0
v 1.9.0
Overview Examples Docs Source

Save options

Example of save PDF as file, string, blob or base64


                        

Survey.StylesManager.applyTheme("modern");
            
                var json = {
  "elements": [
    {
      "type": "text",
      "name": "savepdf",
      "title": "Save me, please"
    }
  ]
};

                window.survey = new Survey.Model(json);
            
        
            survey.onComplete.add(function(sender) {
            document.querySelector('#surveyResult').textContent =
            "Result JSON:\n" + JSON.stringify(sender.data, null, 3);
            });
        
            
                survey.render("surveyElement");
            
function prepareSurveyPDF() {
const surveyPDF = new SurveyPDF.SurveyPDF(json);
surveyPDF.data = survey.data;
return surveyPDF;
}
function savePdfAsFile() {
const surveyPDF = prepareSurveyPDF();
surveyPDF.save("surveyAsFile.pdf");
}
function savePdfAsBlob() {
const surveyPDF = prepareSurveyPDF();
surveyPDF.raw("bloburl").then(function(bloburl) {
  var a = document.createElement("a");
  a.href = bloburl;
  a.download = "surveyAsBlob.pdf";
  document.body.appendChild(a);
  a.click();
});
}
function previewPdf() {
const surveyPDF = prepareSurveyPDF();
var oldFrame = document.getElementById("pdf-preview-frame");
if (oldFrame) oldFrame.parentNode.removeChild(oldFrame);
surveyPDF.raw("dataurlstring").then(function(dataurl) {
  var pdfEmbed = document.createElement("embed");
  pdfEmbed.setAttribute("id", "pdf-preview-frame");
  pdfEmbed.setAttribute("type", "application/pdf");
  pdfEmbed.setAttribute("style", "width:100%");
  pdfEmbed.setAttribute("height", 200);
  pdfEmbed.setAttribute("src", dataurl);
  var previewDiv = document.getElementById("pdf-preview");
  previewDiv.appendChild(pdfEmbed);
});
}
document.getElementById("saveAsFileBtn").onclick = function() {
  savePdfAsFile();
};
document.getElementById("saveAsBlobBtn").onclick = function() { 
  savePdfAsBlob();
};
document.getElementById("pdfPreviewBtn").onclick = function() { 
  previewPdf();
};
                    
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Example of save PDF as file, string, blob or base64, Knockoutjs Survey Library Example</title>

<meta name="viewport" content="width=device-width" />
    <script src="https://unpkg.com/knockout@3.5.1/build/output/knockout-latest.js"></script>
    <script src="/DevBuilds/survey-knockout/survey.ko.min.js"></script>
    <link rel="stylesheet" href="./index.css">
<link href="/DevBuilds/survey-core/modern.css" type="text/css" rel="stylesheet"/>
<script src="https://unpkg.com/jspdf/dist/polyfills.umd.js"></script>
<script src="https://unpkg.com/jspdf@2.3.0/dist/jspdf.umd.min.js"></script>    <script src="/DevBuilds/survey-pdf/survey.pdf.min.js"></script>

</head>
<body>
    
<button id="saveAsFileBtn" style="margin:10px">Save as File</button>
<button id="saveAsBlobBtn" style="margin:10px">Save as Blob</button>
<button id="pdfPreviewBtn" style="margin:10px">PDF Preview</button>
<div id="pdf-preview"></div>            <div id="surveyElement" style="display:inline-block;width:100%;">
            </div>
    <div id="surveyResult"></div>

<script type="text/javascript" src="./index.js"></script>

</body>
</html>

SurveyPDF save options

You may download PDF document as file or get Javascript string or blob objects

Download file

Call save method of surveyPDF object with optional filename parameter to download file in browser. This is asynchronous method

var surveyPDF = new SurveyPDF.SurveyPDF(json);
surveyPDF.save("pdfDocument.pdf");

Get string object

Call raw method of surveyPDF object without parameters to get PDF document as string object. Attention that Javascript strings can't represent all possible bytes combinations of PDF documents, so gotten PDF may be corrupted (e.g. missing bold or fonts mismatch). This is asynchronous method Note: use only with default jspdf fonts.

var surveyPDF = new SurveyPDF.SurveyPDF(json, { fontName: "helvetica" });
surveyPDF.raw().then(function (text) {
    var file = new Blob([text], {type: "application/pdf"});
    var a = document.createElement("a");
    a.href = URL.createObjectURL(file);
    a.download = filename;
    document.body.appendChild(a);
    a.click();
});

Get Blob object

Pass blob string parameter to raw method to get Blob object, or pass bloburl string to get url to Blob
         
var surveyPDF = new SurveyPDF.SurveyPDF(json);
surveyPDF.raw("bloburl").then(function (bloburl) {
    var a = document.createElement("a");
    a.href = bloburl;
    a.download = filename;
    document.body.appendChild(a);
    a.click();
});

Get base64 URL

Pass dataurlstring string parameter to raw method to get base64 encoded url string to PDF document. You may use it to preview PDF on site in embed html tag

var surveyPDF = new SurveyPDF.SurveyPDF(json);
surveyPDF.raw("dataurlstring").then(function (dataurl) {
    var pdfEmbed = document.createElement("embed");
    pdfEmbed.setAttribute("type", "application/pdf");
    pdfEmbed.setAttribute("style", "width:100%");
    pdfEmbed.setAttribute("height", 600);
    pdfEmbed.setAttribute("src", dataurl);
    var previewDiv = document.getElementById("pdf-preview");
    previewDiv.appendChild(pdfEmbed);
});