...
A wizard workflow allows users to navigate through a series of steps or conditions to execute a workflow. Creating a wizard aims to divide a workflow into multiple screens and easily instruct the user on completing the workflow.
...
Create a form for the wizard.
Create wizard workflow and Add forms.
Publish the workflow into the EmpowerID environment.
Test the Workflow.
Create a Form
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.
A form will appear in the workspace with a default name.
Let’s add some fields to the form. Click on the Other Objects → Add Object. In the Add Object window, select String and click on Add.
Rename the object String1 to First Name, and drag and drop the object into the form.
The Next & Back button must be enabled for a wizard. Expand the Approval Decisions and select the Back & Next Button.
Save the form with a meaningful name. You must click on the Save 💾 icon and select the file path. Provide a meaningful name and click on save.
After the form is saved, you will see the form loaded in the designer with the name you provided.
Click on Compile and publish button, to publish the workflow. You can find more information about deploying here in Build and Deploy.
Create a Workflow
...
In the Workspace tree of Solution Explorer, Navigate to the Package node and select Workflows → Applications → New Workflow → Flow Chart Workflow from the context menu.
...
...
The workflow will load with default shapes. Click on the Save icon to save it with a meaningful name.
...
...
Select the file path. Provide a name and click on Save.
...
...
Drag and drop the form we created earlier into the workflow. Expand the User Interface → Forms and select the form created earlier into the workflow.
...
...
Repeat the above step two more times. For simplicity of the tutorial, we will use the same form three times in the wizard workflow.
...
...
Connect the shapes with lines; the lines must be connected from the Start to the End shape.
...
...
Select the first form added to the workflow. Open the Properties window and create a new Event Handler. Please provide an event name in the BeforeExecute events and double-click on it to open the code view.
...
...
When running a workflow in the EmpowerID Web UI, you can determine whether it's a Wizard Workflow or a Simple Workflow by looking at the top of the interface. There, you'll find a line with circles, each circle representing a step in the workflow. If the circle's border is filled, it means you are currently on that step. If the circle itself is filled and displays a check icon, it means you have completed that step.
To transform your workflow into a Wizard Workflow, follow these steps:
Enable the next and back buttons on your activities i.e., Forms, Lookups etc.
In the BeforeExecute event of your first activity, write the following code. Alternatively, you can use the SetDataCode method of the activity instead of the BeforeExecute event handler.
Below, we have the code for converting our workflow into a wizard workflow (Assuming a three-step workflow). You will write the following code in the BeforeExecute event handler or in the SetDataCode method of the activity placed within your workflow.
| Code Block |
|---|
CurrentWorkflow.UiSteps = new WorkflowUISteps(); var step1 = new UIStep(); step1.Name = this.CurrentWorkflow.myNewWizardFormActivity1.QualifiedName; step1.FriendlyName = "My First Step"; step1.Description = "My First Step"; var step2 = new UIStep(); step2.Name = this.CurrentWorkflow.myNewWizardFormActivity2.QualifiedName; step2.FriendlyName = "My Second Step"; step2.Description = "My Second Step"; var step3 = new UIStep(); step3.Name = this.CurrentWorkflow.myNewWizardFormActivity3.QualifiedName; step3.FriendlyName = "My Third Step"; step3.Description = "My Third Step"; CurrentWorkflow.UiSteps.Steps.Add(step1); CurrentWorkflow.UiSteps.Steps.Add(step2); CurrentWorkflow.UiSteps.Steps.Add(step3); |
...
Select the second form. Open the properties window and paste the following code into the AfterExecute event handler.
...
...
CurrentWorkflow.UiSteps.CurrentStep = CurrentWorkflow.UiSteps.Steps[0];
|
step1.Name = this.CurrentWorkflow.myNewWizardFormActivity1.QualifiedName; The name we associate with this property is going to be the Qualified Name of the corresponding activity for that step. Behind the scenes, our workflow engines use this name to locate the activity.
step1.FriendlyName = "My First Step"; FriendlyName property will appear as the step name on the line. FriendlyName can also be localized.
CurrentWorkflow.UiSteps.CurrentStep
...
=
...
CurrentWorkflow.UiSteps.Steps[
...
Similarly, select the third form and paste the following code into the BeforeExecute event.
...
0]; Here on this line we are setting the current step. passing 0 as an index means this activity is going to be our first step in the Wizard Workflow.
If you want to navigate from your last form back to your first form, you can achieve this by writing the following code in the BeforeExecute event handler class or, you can also write the same code in the WizardBackExecuteCode event handler class of the activity.
CurrentWorkflow.UiSteps.
...
PreviousStep =
...
CurrentWorkflow.UiSteps.Steps[
...
0];
...
Click on Compile and publish button, to publish the workflow. Complete the publish wizard; you can find more information about deploying here in Build and Deploy.
Publish the Workflow
Once the workflow and forms are compiled and published, the published file items should be deployed into EmpowerID. All details about publishing the items are available on Publish Workflow Studio Items to EmpowerID Environment. Please make sure that the “.pub” file for both form and workflow is published.
...
Test the Workflow
Login into the EmpowerID.
Navigate to Object Administration → Workflows, and search the workflow published in the previous step.
Click on the name of the workflow to execute it. The UI of the workflow will appear on the screen.
...
See below image for further explanation of what each line of code is doing.
Let’s consider an example if you are going to create a Wizard Workflow which contains three forms. So technically following buttons should be enabled on these forms in following manner.
Form Name | Enabled Buttons |
|---|---|
Form One | Next |
Form Two | Back and Next |
Form Three | Back and Submit or just Submit button depending upon your requirement. |