Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

All workflow applications contain several layers of technology that work together to create a composite application. When human interaction with a workflow is necessary, then the workflow must have a layer that allows for user input, known as the "presentation “presentation layer." The presentation layer is that part of the workflow that users see and interact with when running a workflow.

In Workflow Studio, the main element of this presentation layer is the form, which can be of two types: User Input and User Decision.

User Input forms allow users to enter information and submit the data back to the workflow for use in later activities. User input forms are not "routed," meaning that they appear to any user currently running the workflow at that point in the process where the User Input form is placed.

In contrast, you should use User Decision forms are used when a form needs to be routed to someone to fill out the information or make a decision. User Decision forms offer routing options and create a workflow task for any "approvers" for that form step in the workflow. User Decision forms also provide email notifications to the users that the form is being routed to an approver for a decision.

Forms provide components that allow users to enter information into a workflow and allow you as a workflow developer to capture data for use throughout the workflow. You design forms in the Form Designer and compile and publish those forms to the Workflow Server. Workflow Studio creates a special activity for compiled forms, known as a "Form activity." When a form is compiled into an activity, you can drop the resultant activity onto the design surface of a workflow, making its properties—known as "dependency properties"—available for use throughout the workflow.

Info

In Workflow Studio, form components comprise two category types: 

  • Primitives — allow you to place simple objects such as booleans, datetime controls, and string-based objects (i.e., fields, labels, etc.) on a form

  • RBAC components — allow you to place the properties of any type of component or view (e.g., First and Last names of a Person) on a form


This topic demonstrates how to create forms in Workflow studio by creating both a User Input and a User Decision form, adding multiple component types to each. Specifically, we will create a simple User Input form that could be used in a "Leave Request" workflow and then use that form to create a related User Decision form that could be used a user can use to approve or deny the leave request.

To create a User Input form.

  1. In the Workspace tree of Solution Explorer, right-click the Package node in which you want to create the form and select New User Interface > Form from the context menu.

    Image RemovedImage Added

  2. A form will appear in the workspace with some default naming.

    Image RemovedImage Added

  3. Click on the Properties pane, Enter a name for the form in the Name field, Enter a title and description for the form in the Title and Description fields.

    Image RemovedImage Added

  4. Edit the caption in the default form tab by double-clicking directly on the caption text. Change the caption from Tab1 to Request for Leave.

    Next, add primitive controls to the form to allow users to enter information relevant to the workflow for which the form is being created.

  5. From Click the Add Object button from the Workflow Studio Form Designer Commands menu, click the Add Object button.

    Image RemovedImage Added

  6. In the Add Object window that appears, select the DateTime and MultiLineString objects from the Primitives tab and then click the Add button. The DateTime object uses a Calendar template, allowing users to select choose a date from a calendar interface. The MultiLineString control allows will enable users to enter multiple lines of text.




  7. Open the Add Object window again and add a second DateTime object to the form's Components tree.

    In the form's Components tree under the Other Objects node, DateTime1DateTime2, and MultiLineString1 appear.

  8. To help you identify the purpose for each primitive object you just added to the form's Component tree, double-click each object name to put the label in Edit mode and change the names of each to something meaningful. For example, change: 

    • DateTime1 to StartDate 

    • MultiLineString1 to ReasonForLeave 

    • DateTime2 to EndDate

  9. Add the components to the form by dragging them from the Components tree onto the form in the Form Designer.

  10. Right-click the text control and then click Edit to open the Field Configuration window. Select the Is Double ColumnSpan option and click OK.

    Image RemovedThis Image Added

    As shown below, the above action allows the field to spread across the form, as shown by the below image.

    Image RemovedImage Added

    Next, add a new section with a Captcha control to the form. You can add Captcha controls can be added to any form to provide added security by ensuring that that the user interacting with the form is an actual person and , not a computer program or bot. The Captcha control is added to the form first as a string control and then edited to select Captcha as the type of string control to use.

To add a new section with a Captcha control.

  1. From the Workflow Studio Form Designer Command menu, click the New Section button.

    Image RemovedImage Added

  2. Double-click the default caption text and change it to something meaningful, such as Enter the text displayed in the below image.

  3. From the Workflow Studio Designer Commands menu, click Add Object, select String, then click the Add button.




  4. In the Components tree, change the object's name of the object from String1 to Captcha.

  5. Drag the Captcha control from the Components tree onto the new section and then right-click on it select Edit.

    Image RemovedImage Added

  6. In the Field Configuration dialog, deselect Use Default Control Template in the Control Types tab and click Captcha. Deselect the Show Label property and click OK.

    Image Removed

    From the Components tree, expand Image Added

  7. Expand the Approval Decisions node from the Components tree and select Submit and Canceled. This action adds buttons to the form that allow the request initiator to submit or cancel the request.

    Image RemovedImage Added

  8. Set the FormType property for the form in the Properties grid to UserInput.

    Image RemovedImage Added

    Once you have completed adding controls to the form, you can publish the form by clicking the Build >Publish menu following the Form Publishing wizard. When you publish the form, Workflow Studio converts it to an activity that can be placed within the workflow.

To create a User Decision form.

Tip

In the following example, we use the example User Input form shown above to create an Approval or User Decision form that can be linked to it in a workflow.

  1. Open the User Input form you created above, click the Common menu, and then click the Save As button.

  2. In the Save As dialog that appears, name the form appropriately, saving it in the package of your choice.

  3. Right-click the Enter the text displayed in the image below section and click Delete Section.

    Image RemovedImage Added

    Next, we need to add a new section to the form that can be used for binding bind the properties of the person initiating the request.

  4. To add the new section, click Click the New Section button in the Workflow Studio Form Designer Commands menu to add the new section.

    Image RemovedImage Added

  5. Change the section's name of the section to Initiator of the Request by double-clicking the default text.

    Image Removed

    From Image Added

  6. Click the Add Object button from the Workflow Studio Form Designer Command menu, click the Add Object button.

    Image RemovedImage Added

  7. In the Add Object window that appears, click the Rbac Components tab, scroll to and select Person, and then click Add. This You will see a dialog that allows you to drag any attributes of an EmpowerID Person onto a form as a dependency property.

    This


    Clicking on Add button adds a component, named Person1, to the Components tree located to the left of the form. The Person1 component contains the attributes or properties of the EmpowerID Person component.

    Image RemovedImage Added

  8. Double-click directly on the Person1 text to place it in Edit mode and change the object's name of the object to Initiator. This data property represents the person Person initiating the leave request.

    Image RemovedImage Added

  9. Expand the Initiator object node, locate the FriendlyName attribute and drag it onto the Initiator section of the form.

    Image RemovedImage Added

  10. Edit the FriendlyName label, changing the text from FriendlyName to Name.

  11. From the Initiator object node, locate and drag the DepartmentTitleEmail, and Telephone attributes onto the form, arranging them so that they look like the below image.

    Image RemovedImage Added


    Now we want to make all of the fields on the approval form read-only as we don't want the approver to have the ability to alter the original request data. In this scenario, the fields in the Request Details section of the form will receive their values from the information entered in the Request Details section of the Leave Request form by the request initiator, while the fields in the Initiator of the Request section will receive their values from the binding that occurs between the request initiator and the initiator component we just added to the form.

  12. Right-click the Start Date field and select Edit from the context menu.

    Image RemovedImage Added


  13. In the Field Configuration window that appears, select Read Only from the lower pane and then click OK to close the window.

  14. Repeat the above two steps for the rest of the objects in both sections of the form. Once completed, you should see only the object labels, as shown by the below image.

    Image RemovedImage Added

  15. From the Components tree, expand the Approval Decisions node and do the following to add buttons to the form that allow the approver to make a decision about the request.

    • Select Approved

    • Select Rejected

    • Select Delegated

    • Select ReturnedToSender

    • Deselect Submit

    • Deselect Canceled
      Also, make sure to choose User Decision in FormType in the form properties window.

      Image RemovedImage Added

  16. Save your changes and publish the form to make it available to workflows as a From activity.

To publish forms

The forms developed above will have to be deployed to make them available to workflows. Build and deployment topics are detailed in the articles below,

Batch deploy to a local folder
Deploy to EmpowerID Environment


Div
stylefloat: left; position: fixed; padding: 5px;
idtoc
classtopicTOC

In this article

Table of Contents
stylenone






Insert excerpt
IL:External Stylesheet
IL:External Stylesheet
nopaneltrue