Components
form
signature-field
5min
simply draw your signature on your mobile screen to approve and proceed this component can only be used in a jig default docid\ rtomyji3uoxiqxdultz3o inside of a form docid\ digx9ijgzlsa22yfyeszy component for the input of a signature it provides the experience of creating, uploading, and saving your esignature in a few easy steps signature field preview configuration options configuration options some properties are common to all components, see common component properties docid\ llntd rxe8fmh7wpc5czb for a list and their configuration options core structure instanceid the unique identifier for the signature field component label provide a label/name for the signature field 'label' is displayed as a placeholder when no value is specified other options color sets the color of the signature field based on conditions by using the when property first evaluated to true will be used choose a color from the provided color palette default color is grey if the property is not specified in the yaml see the list of available colors in jigx color palette docid\ alxcnrj rgickyu94iyws errortext add text, string, or expressions to show text under the signature field indicating an error/invalid value in the field text is shown in isnegative (red) styling with a red exclamation icon on the right helpertext add text, string, or expressions to guide users by showing text under the signature field helper text is displayed only when there is no errortext icon add an icon to the signature field, for example a pen icon the icon apprears on the far right of the field a list of icons is available see jigx icons docid\ kcd yl jqeuthf7cpfe91 for more information initialvalue the initialvalue is the value that will be displayed in the signature field when the form is initially loaded you can use this property to preset the field with a default signature so that you do not have to manually select it or if you already have the person signature in a datasource you can use anexpresssion to return the intial signature tapping on the field allows the person to re sign the form if required using the reset state action with initialvalues does not clear the field, it resets the field back to it's initialvalue isautofocused if true the signature field will get focus immediately after the form is displayed and the number keyboard will be opened automatically ishidden if true the signature field will be hidden on the form if set to false the field will be shown isignored when true , the field will be ignored when submitting the form and the content will not be stored isoptionallabelhidden if the field is optional you can turn off the "(optional)" label by setting this field to true this property works in combination with isrequired false isrequired set to true when the field is required useful when you use it in form submission as the submit button remains disabled until the signature has been applied set to false the signature field is optional and will have (optional) in the label nextproperty name of the property you want to focus next in the form when you use return/next on a keyboard style the following property settings are available \ flex flex property if rendered inside row \ isbusy displays spinner on right side of field it removes any configured icon \ isdisabled disables the signature property preventing any input \ ispositive a green green icon displays on the right of the signature more than one can be true it will be evaluated based on priority value the value to show in the signature field when the form initially loads this can be combined with the isdisable style to preset the value that cannot be edited on the form actions onchange the action is triggered when the content in the signature field is changed use intellisense (ctrl+space) to see the list of available actions state configuration key notes =@ctx component state value state is the variable of the component =@ctx solution state activeitemid now global state variable that can be used throughout the solution examples and code snippets examples and code snippets signature field on form form signature the widget displays the signature input after clicking on it, the user can create his/her esignature example see the full example in github signature children \ type component form instanceid new customer form options children \ type component signature field instanceid signature options label signature required see also state docid 0js3trstyj4kcu6vviv1y