Description:
The widget saves the Form when assigned to a user as a task (use the routeForm step in the workflow).
Inputs
- Button Type - Select between any of the button types
- ID/Name - Name of widget generated by FlowWright (read-only field)
- Button Label - Enter the description text for the button label
- Hide - Select the checkbox to Hide (tick mark)
- Read Only - Select the checkbox to Read-Only (tick mark)
- Pre-prompt message - Enter the text message to pre-prompt
- Post-prompt message - Enter the text message to post-prompt
- Tool Tip - Enter information to display on mouse hover on form render
- Styles - Enter the CSS scripts for widget styles
- Apply Classes - Select between custom classes defined
- Save - Save the input values
- Delete - Remove this form widget from the designer page
- Close - Close the input popup window
Design:
Example:
Let’s build and execute the “SaveFormDef” example.
- Create a new Form Definition called “SaveFormDef.”
- Drag a “First Middle Last Name, Address, Save and Submit” control onto the canvas and arrange it as shown below. Double-click the text control and configure its properties as needed for user input (optional).
- Double-click the “Save” widget to configure the “Settings” properties. Select the button type from the drop-down list, with “Success” as the default. The application provides the control name. Enter a button label. Select the check box to hide or set the control to “read-only” at runtime. Enter the pre-prompt message to alert the user before the save action. Enter the post-prompt message to inform the user after the save action is completed. Enter the URL to redirect to after the post action. Click the Save button.
- Double-click the “Save” widget to configure the “Styling” properties. Enter the CSS syntax. Select the classes to apply from the global drop-down list. Click the Save button.
- Double-click the “Save” widget to configure the “Other” properties. Enter the tooltip text. Click the Save button.
- Double-click the “Save” widget to configure the “Globalize” properties. The application will notify you if there is nothing to globalize, as shown below. Otherwise, select a language from the drop-down list, then click the Translate button. Finally, click the Save button.
- Create a new Process Definition called “SaveFormDef.”
- Drag a “RouteForm and PlaceHolder” step onto the canvas. Connect the dots from Start to the other steps, as shown below.
- Double-click the “RouteForm” step to configure the “Required” properties. Enter a name for the step. Enter the task name. Select the Form definition from the drop-down list. Enter a variable or global reference to hold the Form Instance ID. Click the Save button.
- Double-click the “RouteForm” step to set up the “Optional” properties. Enter a task description. Configure the users who will route the Form. Set the task priority and duration. Click the Save button.
- Create and run a new process instance. The "Form" task is assigned to the designated user.
- The Form task is displayed for the user to complete. Enter the user input, then click the Save button. The pre-prompt message alert appears as shown below. Click the Ok button.
- The post-prompt message alert appears as shown below. Click the Close button. The form then navigates to the configured Dashboard URL.
- Go to the Form > Instances page. Select and display the Form Instance as shown below.
- The Form is shown in read-only mode, as illustrated below.
Definition Sample:
You may download and extract the sample definition(s) from the link provided, then import them (drag-and-drop) into your FlowWright Process Definition (XML file) or Form Definition (HTML file) page.
Note: Please verify and complete the process steps for any missing configurations, such as file path references and database connections, after the import. Then, save the definition to confirm the changes.
Click here to download the sample file.