How do I change the Visibility and Editability for different workflow steps?

Modified on Wed, 21 Feb at 1:52 PM

The users at different steps within the workflow will likely have different responsibilities. Droplet makes it easy for form users to fulfill their responsibilities by allowing customization of each component's visibility (visible or hidden) and editability (editable or readonly) at each step in the workflow. This allows you to show only the information that is applicable and allows editing access to only the fields that need to be completed at that step in the workflow. 


This article will walk you through how to configure the visibility and editability of components on your form. You will also see examples of best practices to help your form be more efficient.


Available Visibility Permissions


Three different states can be assigned to components at each workflow step:

  • readonly - the component is visible but it is not editable at that particular stage in the workflow.
  • hidden - the component is not visible to the user at this step.
  • editable - the component is visible and can be adjusted by the user at this step.



Default Visibility Permissions
Generally, when you build your layout within the Visual Builder, Droplet will add the component ID to the start step and declare it editable. For all other workflow steps, the visibility will default to readonly. If you would like a component to be editable at any other step or to be a different state at the start step, you'll need to update it here in the visibility layer. You can make a component editable in one or more steps in the workflow.


Updating Visibility Permissions


1. Within the Form Layer, navigate to Visibility from the left-side panel.


2. You can select the component to update from the Navigation Tree (within the Visibility Panel) or the Form Canvas.


3. Within the right-side panel on the Steps, you will be able to choose the visibility permissions for each of the workflow steps. Not all components can be editable, but all components can be hidden or readonly. 


Visibility Best Practices


Grouping related components


It is always best practice to only show the fields necessary for the assignee to complete their responsibilities. In the example below, the Secretary Approval fields will not need to be visible to the person initiating the form. Grouping those fields into one Section or Group is an easy way to hide/display related fields only when applicable. In this case, I want to hide this Section on the Start step. 



Everything inside the container (Section Component) will also be hidden. You will need to ensure the correct visibility permissions are set for the individual components within the container (Section Component) by manually selecting those components and changing the visibility settings. You will not be allowed to change the visibility on any workflow steps where the container is set to hidden.



Once components are hidden at the start step, they will be shown with a striped layer over top. This helps you identify what will be visible on the start step as you are working within the builder. It is also a good idea to utilize the Debug view and switch between different steps so you can see how the form will look to users at each workflow step.


Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select at least one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article