Document Viewer On Form
  • Updated on 20 Mar 2017
  • 1 minute to read
  • Print
  • Dark
    Light

Document Viewer On Form

  • Print
  • Dark
    Light

This tutorial demonstrates how to use Document Viewer Component in Decisions . This component was introduced in Decisions 4.0 and serves to display PDF documents. Pdf documents that we want to display should be Document entities in Decisions Portal and could be displayed with Document Viewer component by document Id.
Example:
In this example we are going to build a simple Flow with a Form . Then, we are going to display a PDF document on the Form .
We begin in the Designer Folder with clicking Create Flow on Folder Actions Panel.
2018-01-02_143410-1024x698.png

Then, we Name the Flow and click Ok to proceed to the Flow Designer.
2018-01-02_143710-1024x613.png

In the Flow Designer we add Show Form step from the Favorite Steps Category.
2018-01-02_143810.png

In the resulting window we Name the Form and click Create to proceed to the Form Designer.
2018-01-02_144016.png

In the Form Designer we add Button for end users to be able to submit the Form . Then, from Data category we add Document Viewer Component .
2018-01-02_144215-1024x459.png

We resize Document Viewer Component to fit our needs. Document Viewer Component can display static document if we check Static Input check-box and provide static document Id . Or, we can define Data Name and push document Id from the Flow . This completes our Form . We can save the Form and close Form Designer.
2018-01-02_144516-1024x629.png

Back in the Flow Designer we connect the outcome from Show Form step to the End Step . Then, we configure Form Inputs . In this example we provide Constant Document Id for Document Viewer Component. Pdf document that we want to display with Document Viewer should be a Document Entity in Decisions Portal.
2018-01-02_150049.png

This completes our Flow . We can click Debug Flow on the top panel in the Flow Designer to test our Flow .
2018-01-02_150235.png

Our Form opens in the debugger and we can see that Document Viewer displays our PDF document. We can also download or print this document from the Document Viewer Component.
2018-01-02_150531-1024x630.png

Was this article helpful?