Let’s see how we can use Smartform’s states to show different views at different approval stages of a workflow using a sample process as shown below
Now above flowchart has 3 approval activities Manager Review, Final Review & User Acceptance. In general approach, we need 3 forms for above activities and 1 for submitting the request so total 4 forms. Now using these states, we just need one form to handle all these. Let’s see how we can do.
Step 1: Creating Views and Forms
We need one view to submit the request & one for approval activities. Design 2 views as below
View 1: SubmitView
View 2: ApprovalView
Now create one smartform and add these views in that. Note that ApprovalView needs to be dragged twice which we are going to use one for ManagerApproval & one for FinalApproval. Please see below screenshot.
Here in form I have took 3 tables which has 3 buttons in each of them. These tables will be shown according to approval activity.
Step 2: Creating a Smartobject
Create a smartobject to store the data of the all form fields. Here I have created a smartbox smartobject as below
Step 3: Create Workflow
In designer, create a new workflow give it a name, in forms section select the form that we have created above, and select Use an existing state and select Base State
Create a data field RequestID
Now in configure start rule of workflow, form rules will be automatically populated. if it doesn’t show up here, we need to write the submit rule in form and come back here to configure this step.
Here I have already written those rules in submit button click rule of form.
Creating Manager Approval Task
- Now drag a new User Task on to canvas.
- Give Manager Approval as name.
- Add Approve & Reject as actions & Check 2 checkboxes that are shown there and Click
- It will show outcome settings just leave the options as it is and click Next.
- In Participants section drag the Manager to the task group.
- In UserForm Section select Create a new State option give ManagerApproval as name & click Action Settings button select I will configure the action later option and click Finish and click
- In next form let the default options as it is and click Finish.
Check the screen shot below
Now similarly configure the other 2 approval activities Final Approval & User Acceptance. Both activities should have the same form that we selected above and in every case we need select create a new state option and give FinalApproval & UserAcceptance as state names
And in all reject cases send a mail using email event and also in accept case too.
Below is the workflow screen shot after changes.
Step 4: Configure Smartform rules
Now when you open the smartform and navigate to rules section you should see 4 states, (Base State), ManagerApproval, FinalApproval, UserAcceptance. See screenshot below
State are similar to views in SQL, they are used to show the data according to the user or approval activity.
Here in this case (Base State) is considered as a form to Submit Request. In this state, we will hide the other 2 views and show buttons that are used to submit the request . Rest all controls are made hidden. This will be considered as the default state of this form. It will look as below screen once the rules are configured
Please note that all the base state rules will be automatically derived into other states.
- Now let’s configure the next State ManagerApproval.
Click on state ManagerApproval and see the rules that are in base state are already appearing here. Here I’ve created an unbound rule LoadManagerApproval in which I have wrote the rules for hiding the controls of submit state, make the second view visible and make the controls in first view as non-editable.
Now in form initializing rule you should see a rule which got automatically added from workflow.
Here in open Manager Approval Worklist item rule configure options get the RequestID from output mappings of the workflow Datafields. Use this RequestID to load the data from smartobject and populate in first view.
Same way we need to configure the other states by showing and hiding controls/views based on the approval activities. Once all the rules are configured the forms should look as below
Once the request is submitted.
Manager Approval (ManagerApproval State)
Once the request is submitted approval task will be assigned to his manager and below is the screen shot of the how this view would look like. Now Manager reviews and provides his feedback and approves the request.
Final Approval (FinalApproval State)
Below is the screenshot of how the approval form will look like. Final Approver will review the ratings and provide his feedback and sets the final rating and approves the request.
Now the requestor gets the task to review his rating and accept it.
User Acceptance (UserAcceptance State)
User gets the task to review his rating and he can either accept or adjust/Resign 😊
Once he accepts, the workflow will end and task will be completed.
That’s it!! This is how we can use smart form states to show a single form to show different views at different approval activity levels.