How-Tos

How to use signatures

In this video, you will learn how to use signatures in Centrldesk.

In this video, you will learn how to use signatures in Centrldesk.

Signature retrieval is required for many use cases, such as signing a document or a contract. In this example, we are asking for the user's signature to use in a document later. So let's start building our application:


Steps:

  1. First, we go to the page editor by clicking on the Edit Page button.
  2. Add a button using drag and drop.
  3. Change the name of the button to "Create signed document", and choose an icon and a color.
  4. Next, we add an action to the button by clicking the "Add" function on the "On Click" event.
  5. The Flow Editor opens.
  6. On the left side, under Libraries, we now drag and drop the "Interaction" element into the center of the Flow Editor.
  7. The "Interaction" dialog opens.
  8. Select "Show Signature Dialog" on the left side and confirm with OK.
  9. On the left side, under App Components, we now drag and drop the "Document" element into the center of the Flow Editor.
  10. The "Use Document" dialog opens.
  11. Select "New Document", enter a name for the document, and confirm with OK.
  12. On the left side, under Libraries, we now drag and drop the "File Processing" element into the center of the Flow Editor.
  13. The "File Processing" dialog opens.
  14. Select "Convert to PDF" on the left side and confirm with OK.
  15. On the left side, under Libraries, we now drag and drop the "File Processing" element into the center of the Flow Editor.
  16. The "File Processing" dialog opens.
  17. Select "Download Files" on the left side and confirm with OK.
  18. Connect the Submitted output of the Show Signature Dialog block to the input of the Document block.
  19. Connect the output of the Document block to the input of the Convert to PDF block.
  20. Connect the output of the Convert to PDF block to the input of the Download Files block.
  21. Select the document and click Edit Document.
  22. The document editor opens.
  23. In order to use the signature queried earlier in our flow we need to create a variable.
  24. On the left side, click New under Variables.
  25. Enter a name, select "File" for the type, select the Input Checkbox, and confirm with OK.
  26. Now click the black arrow to use the variable content in your document.
  27. Then we can resize and align the image and customize our document if needed.
  28. Close the document editor by clicking Close in the upper left corner.
  29. Select the Convert to PDF block and give the file a name by selecting Enter Value under Filename on the right side and entering a file name.
  30. Select the Download Files block and choose the value "Converted PDF" under "Source One" on the right side.
  31. Close the Flow Editor by clicking close in the upper right corner.
  32. Close the PageEditor by clicking close in the upper left corner.
  33. Now we can start using our application.
  34. Clicking on the "Create signed Document" button opens the "Sign Here" dialog.
  35. Sign with a tablet pen, finger on a touchpad, or mouse.
  36. Confirm the dialog with OK.
  37. The Downloads dialog with the automatically created PDF file is displayed.
  38. Clicking on the document will open the PDF with the signature.

Similar posts

Subscribe to our newsletter

Stay up to date on upcoming news and topics of creating web apps without code.