MaestroThe UI design product. |
Form Builder | All versions
This feature is related to all versions.
Maestro comes with the Signature Pad component enabling a form user to sign an application form digitally. This component allows the user to create a signature by drawing it on the pad, saving it, clearing the pad to redraw the signature, or canceling it. The image below shows how the Signature Pad component appears on a rendered form.
Usage
Open the Palette pane in the Maestro Editor.
Locate the Signature Pad component within the Business Data folder.
Drag the component into the View pane or the Wireframe.
Configure the component's properties via the Properties pane.
Properties
The following properties are available to the Signature Pad component:
Sign Text
Text
signText
The text used for empty signature box
Sign Icon
Icon
signIcon
The icon used for empty signature box
Signature Name
Field Ref Map
signatureNameRef
Map form's field references for first, middle and last names that is displayed in the rendered Signature Pad component.
Click 3 Field References to map up-to 3 field references in the Signature Name for Signature Pad window.
Drag and drop a field from the Navigation bar to the Field Reference column against a Key you want to map. Repeat it for other references if needed.
Click Save to update the mapping.
Preview the form and Click to Sign to test the Signature Pad.
You can now see the first and last names appear at the bottom left corner of the component.
Include Date
Boolean
includeDate
Select the Include Date checkbox to show the date when the user signs the form at the bottom left corner of the component, as shown above.
Note
Every time the user updates a signature, the signature timestamp (data.signaturePad.signatureDate) is updated. You can reference this value in other JavaScript code by right-clicking the Signature Pad component in Code View and selecting Signature Date.
Date Format
Date
dateFormat
Enter the date format that is used to render the date and time when the form is signed, for example dd/MM/yyyy HH:mm. The default is dd/MM/yyyy.
