Pages

# Dropdowns with recipe data source

LIMITED ACCESS

This feature is a limited access release. Limited access features are those that have passed the development phase and are now ready for customer use. Our goal is to gather your input to ensure their reliable release in upcoming enhancements.

During the limited access release, Workato may update its functionality or change its availability to customers without prior notice.

Workflow apps enables you to use recipes as a data source for dropdown components. This allows you to dynamically populate dropdown components with data from your other applications. This ensures data consistency and reduces manual effort. You can use your existing recipes to fetch data from your apps or create new ones directly from the page editor.

Dropdown component in Apps portal Dropdown component with a recipe as its data source in the Apps portal

# How it works

This feature works behind the scenes to surface data from your other applications in your Workflow apps pages. At a high level, this feature uses the following logic:

graph TD A((App user)) --> B(Opens page in the Apps portal) B --> C(Opens or types into dropdown component) %% Behind the scenes recipe actions with dotted lines C -.->|Behind the scenes| X[[Recipe triggers]] X -.-> Y[[Gets data from app]] Y -.->|Returns data instantly to dropdown| C %% Styles classDef default fill:#b3fef7,stroke:#1a1717,stroke-width:1px; classDef behind fill:#eaf7f8,stroke#1a1717,stroke-width:1px; classDef user fill:#e9eeff,stroke#1a1717,stroke-width:1px; %% Behind the scenes X:::behind Y:::behind %% User A:::user

# Use cases

The following use cases provide examples of how you can use this feature to address your business objectives.

# Customer support

Scenario: A customer support workflow requires updating customer account information from a Workflow app page dropdown, which is dynamically populated based on data from a CRM system.
Solution: A recipe retrieves a list of customer accounts from Salesforce in real-time, ensuring the dropdown reflects the most up-to-date data. The employee can then update the account using a Workflow apps page. Submitting the page triggers an additional recipe that updates the account in the CRM.

# Sales order processing

Scenario: Sales representatives must select products from a dropdown when creating sales orders. The product list is stored in an inventory management system and changes frequently.
Solution: A recipe fetches the latest product list from the inventory system, ensuring sales representatives always have access to the current product offerings.

# HR onboarding

Scenario: An HR team needs to assign new hires to various departments, which are stored in a database and frequently updated.
Solution: A recipe fetches the latest list of departments from the database whenever the dropdown is accessed, ensuring the HR team always sees the most current options.

# How to set up recipes as a data source

Complete the following steps to set up this functionality in your Workflow app.

Create a new page or edit an existing page.

Add a Dropdown component to your page and select Recipe as the data source.

Select recipe as the data source Recipe as a data source

If existing recipes in your Workflow apps project contain the New component event (Dropdown) trigger, Workato displays them here. Otherwise, you can create a new recipe.

Create new recipe

This recipe fetches accounts from Salesforce and returns it to your Workflow app. Refer to the recipes section of this documentation for additional sample Salesforce, Jira, Okta, and HTTP recipes you can use to populate your dropdown components.

Click Create recipe.

Name your recipe. Workato names the recipe Get data from dropdown by default. We recommend giving this recipe a unique name to differentiate it from others in your project. For example, Get data from dropdown (Account ID).

Select recipe as the data source

Click Start building.

Workato automatically creates a recipe skeleton with the New component event (Dropdown) trigger and Return data to component action. Combined, they run the workflow when a user expands the dropdown component. The recipe searches your third-party application for data that matches the configuration and instantly returns the data to your dropdown component.

Recipe skeleton

Configure the trigger.

Use recipe to find search results?
Select Yes in most situations where the number of records in the target system is high and must be searched using the recipe. When Yes is selected, Workato requires you to map the Search query | Step 1 datapill into the corresponding fetch action. Select No when the number of records in your target system is fewer than 1000. When No is selected, you can perform the search locally in Workato after the records are retrieved.

In our example, we select No because the number of records is a known low amount.

Set use recipe to find search results to No

Click + Add step to add an app and action to Step 2. This example uses Salesforce and the Search records (Account) action, which enables us to surface customer accounts in our page.

Add an app and action to Step 2

Configure the Salesforce action.

Search for
Select the Salesforce object you plan to search for. For example, Account.
Fields to retrieve
Improve recipe performance by selecting only the fields relevant for your use case. Otherwise, all fields in the selected object are returned to the data tree if left blank. For example, enter Account ID and Account name only.
Limit
Enter the maximum number of records you plan to return. Set 1000 as the maximum.
Active
Select Yes to search for only active accounts.

Configure the Salesforce action

Configure the Return data to dropdown action by mapping datapills into the following fields:

Dropdown options list source
Map the Accounts | Step 2 datapill.
Value
This is the unique ID that corresponds to the account. Workato stores this value in your Workflow app's data table. Map the Account ID | Step 2 datapill.
Label
This is the value Workato displays to your app users on your page. Map the Account Name | Step 2 datapill.

Configure the Return data to dropdown action

Click Save, and Exit. Then, return to your page to finish setting up this component.

Use existing recipe

Select a recipe from the dropdown. Workflow apps displays whether the recipe is active or inactive. If the recipe is inactive, Workato shows an error message indicating that the dropdown doesn't contain any options.

Select a recipe from the dropdown

Save the Selected value and Selected label (Value and Label, respectively) to data columns. Saving the Selected value is required, as Workato uses this value in your recipes. Saving the Selected label is optional.

Save value and label to data columns

View and test your page in the Apps portal.

View and test your page in the Apps portal

# Example recipes

The following recipes demonstrate how to fetch data from your applications for use in dropdown components in your Workflow apps pages. The recipes in this section are examples only. Additional customization can be necessary depending on your applications and use case.

Salesforce: Get data for multiple dropdowns
Jira: Get data using JQL
Okta: Get users for dropdown
HTTP: Get data from an API

# Salesforce: Get data using multiple dropdowns

This example demonstrates how to configure pages with interdependent dropdowns. In this scenario, customer support representatives plan to update customer account details during a deal renewal cycle. The page includes separate Account and Opportunities dropdowns, each with its own recipe that fetches data from Salesforce and returns it to our app. The second recipe filters opportunities by Account ID. This enables customer support representatives to select an account and view opportunities specific to that account.

# Set up this recipe

PREREQUISITES

Before proceeding, ensure you have completed all steps in the How to configure recipes as a data source section, as this describes how to set up the first recipe required to configure interdependent dropdown components.

Complete the following steps to set up the recipe.

Add an additional Dropdown to your page. Give this component a unique name, such as Opportunities and select Recipe as the data source.

Click Create recipe and name your recipe appropriately. Workato automatically generates a recipe skeleton with the New open or search event trigger and the Return data to dropdown action.

Recipe skeleton

Configure the New open or search event from a dropdown trigger

Provide one or more input parameters. Input parameters enable you to set up custom variables that control trigger behavior. In this situation, we plan to filter opportunities by Account ID, so we define that as a parameter.

Specify the Name and Data type for each input parameter. For example, account_id and string.

Add input parameters

Set the Use recipe to find search results? field to No.

Set use recipe to find search results to No

Click + Add step to add an app and action to Step 2. In our example, we've selected the Salesforce Search for records action.

Configure the Search for Opportunities in Salesforce action

Specify the Salesforce object you plan to retrieve in the Search for field. For example, Opportunity.

In Fields to retrieve, select the fields relevant to your use case. Otherwise, all fields in the selected object are returned to the data tree if left blank. For example, select Opportunity ID and Name.

In the Limit field, enter the maximum number of records you plan to return. For example, 150.

Set Closed to No.

Configure the action Configure the Search Opportunities action

Configure the Return data to dropdown action

Map the Opportunities | Step 2 datapill to the Dropdown options list source field.

In the Value field, map the Opportunities ID | Step 2 datapill. This is the unique ID that corresponds to the account. Workato stores this value in your Workflow app's data table.

In the Label field, map the Name | Step 2 datapill. This is the value Workato displays to your app users on your page.

Configure the return data to dropdown action

Click Save, and Exit. Then, return to your page to finish setting up this component.

In the Recipe input parameters field, map the Selected value datapill that corresponds to the Account ID. This ensures that the Opportunities dropdown is populated with opportunities corresponding only to the account your user selects.

Configure the return data to dropdown action

Save value and label to data columns

View and test your page in the Apps portal. In this example, only opportunities associated with the United Oil & Gas Corp. account are displayed.

View and test your page in the Apps portal

# Jira: Get data using JQL

This example demonstrates how to fetch issues from Jira and return them to a dropdown component in your Workflow app pages. The recipe supports type-ahead search, enabling users to search for Jira tickets in real-time. If no search query is provided, the recipe fetches all issues in Jira and returns the name and ID of the first issue.

# Set up this recipe

Complete the following steps to set up the recipe.

Add a Dropdown to your page. Give this component a unique name, such as Issues and select Recipe as the data source.

Click Create recipe and name the corresponding recipe appropriately. Workato generates a recipe skeleton with the New open or search event trigger and the Return data to dropdown action automatically.

Recipe skeleton

Configure the New open or search event from a dropdown trigger

Set Use recipe to find search results? to Yes.

This is the appropriate choice in most situations where the number of records in the target system is high and must be searched using the recipe. When Yes is selected, Workato requires you to map the Search query | Step 1 datapill into the corresponding fetch action. Select No when the number of records in your target system is fewer than 1000.

Use recipe for search results Select yes to use the recipe to find search results

Set up an is Search query present IF condition in Step 2.

This portion of the recipe enables type-ahead search.

Map the Search query | Step 1 datapill into the Data field.

Select is present from the Condition dropdown.

Configure an IF condition

Click + Add step to add an app and action to the Yes portion of the IF condition. Select Jira and the Search issues by JQL action.

Configure the Search issues by JQL action

Upon user input, this portion of the recipe searches Jira for issues.

Configure a JQL query string to search for data matching your criteria in Jira. For example:

summary ~ "\"SEARCH_QUERY_DATAPILL\"" order by summary desc

Learn more about JQL (opens new window).

Replace the following section of the query:

SEARCH_QUERY_DATAPILL: Map the Search query | Step 1 datapill.

Enter a JQL query

Click + Add step to add an action to the Yes section of your IF condition. Select the Workflow apps Return data to component action.

Configure the Return data to dropdown action

Map the Issues | Step 3 datapill into the Dropdown options list source field.

In the Value field, map the Summary | Step 3 and Key | Step 3 datapills. This is the unique ID that corresponds to the account. Workato stores this value in your Workflow app's data table.

Configure the Return data to dropdown action

Click + Add step to add an ELSE IF condition to the No condition. If there are no results matching the search query, this portion of the recipe returns the first issue.

Click + Add step to add an action from an app. Select Custom action in Jira.

Set up your Custom action in Jira. Refer to our page on creating a custom action to learn more.

Click + Add step to add an action from an app. Select the Variables by Workato Create empty list action.

Set up your Create empty list action

Provide a List name. For example, Issues.

Define your list item schema. You can provide sample JSON or add fields manually. In our example, we have added the Label field because we plan to display the corresponding issue label to our end users.

Click + Add step to add an action from an app. Select the Workflow apps Return data to component action.

Click Save, and Exit. Then, return to your page to finish setting up this component.

Save value and label to data columns

View and test your page in the Apps portal.

# Okta: Get users for dropdown

This recipe demonstrates how to retrieve user profiles from Okta and return them to your Workflow apps pages. It supports type-ahead search, enabling users to search for Okta profiles in real-time. When a search query is provided, the recipe splits it into first and last name parts, searches Okta for users whose first name starts with the first part and last name starts with the second part, and returns the first matching user's details. If no matches are found, it returns an empty response to the dropdown.

# Set up this recipe

Complete the following steps to set up the recipe.

Add a Dropdown to your page. Give this component a unique name, such as Users and select Recipe as the data source.

Click Create recipe and name the corresponding recipe appropriately. Workato automatically generates a recipe skeleton with the New open or search event trigger and the Return data to dropdown action.

Recipe skeleton

Configure the New open or search event trigger

Set Use recipe to find search results? to Yes.

Use recipe for search results Select yes to use the recipe to find search results

Set up an is Search query present IF condition in Step 2.

This portion of the recipe enables type-ahead search.

Map the Search query | Step 1 datapill from Step 1 into the Data field.

Select is present from the Condition dropdown.

Configure an IF condition

Click + Add step to add an additional action to the Yes section of your IF condition. Select Variables by Workato and the Create variable action.

Set up your first variable

This portion of the recipe splits the search query into two parts and creates a variable for the user's first name.

Click Add a variable. Provide a unique Label and Data type for the variable. For example, FirstPart, and String.

Add a variable

Click Formula to define the variable using formula mode.

Map the Search query | Step 1 datapill into the formula. Use the .split formula to divide the search query into two parts, using a space (" ") as the delimiter. Add [0] to indicate you're selecting the first part of the search query.

Use .split to create a variable from the first part of the datapill

Click + Add step to add an additional action to the Yes section of your IF condition. Select Variables by Workato and the Create variable action.

Set up another variable

This portion of the recipe splits the search query into two parts and creates a variable for the user's last name.

Click Add a variable. Provide a unique Label and Data type for the variable. For example, SecondPart, and String.

Add a variable

Click Formula to define the variable using formula mode.

Map the Search query | Step 1 datapill into the formula. Use the .split formula to divide the search query into two parts, using a space (" ") as the delimiter. Add [1] to indicate you're selecting the second part of the search query.

Use .split to create a variable from the second part of the datapill

Click + Add step to add an action to the Yes section of your IF condition. Select Okta and the Search users action.

Set up the Search query

Use the following search query:

profile.firstName sw "FIRSTPART_DATAPILL" and profile.lastName sw "SECONDPART_DATAPILL"

Learn more about filtering expressions (opens new window) in Okta.

Replace the following:

FIRSTPART_DATAPILL: Map the FirstPart | Step 4 datapill.
SECONDPART_DATAPILL: Map the SecondPart | Step 4 datapill.

Click + Add step to add an action to the Yes section of your IF condition. Select Workflow apps and the Return data to dropdown action.

Configure the Return data to dropdown action

Map the Users | Step 6 datapill into the Dropdown options list source.

Enter the following into the Value field. This is the unique ID that corresponds to the records Workato stores this value to your Workflow app's data table.

User ID is ID_DATAPILL | User status is STATUS_DATAPILL | Last update STATUS_CHANGED_DATAPILL | FIRSTNAME_DATAPILL LASTNAME_DATAPILL (USERNAME_DATAPILL) | Password = VALUE_DATAPILL

Replace the following:

ID_DATAPILL: Map the Users | Step 6 datapill.
STATUS_DATAPILL: Map the Status | Step 6 datapill.
STATUS_CHANGED_DATAPILL: Map the Status changed time | Step 6 datapill.
FIRSTNAME_DATAPILL: Map the First name | Step 6 datapill.
LASTNAME_DATAPILL: Map the Last name | Step 6 datapill.
USERNAME_DATAPILL: Map the Username | Step 6 datapill.
VALUE_DATAPILL: Map the Value | Step 6 datapill.

Map the First name | Step 6 and Last name | Step 6 datapills into the Label field.

Click + Add step to add an action. Select the Else action. If there are no results matching the search query, this portion of the recipe returns an empty value to your dropdown.

Click + Add step to add an action from an app. Select the Workflow apps Return data to dropdown action.

Click Save, and Exit. Then, return to your page to finish setting up this component.

Save value and label to data columns

View and test your page in the Apps portal.

# HTTP: Get data from an API

This recipe demonstrates how to fetch locations based on a user's search query and return the result to your Workflow apps page. It uses the HTTP connector to send a custom GET request to the Geoapify Location Platform API. The recipe supports type-ahead search, enabling users to search for locations in real-time. It returns a list of matching locations and formats the first result into a readable address, which is then returned to your page.

# Set up this recipe

Complete the following steps to set up the recipe.

Add a Dropdown to your page. Give this component a unique name, such as Addresses and select Recipe as the data source.

Recipe skeleton

Configure the New open or search event trigger

Set Use recipe to find search results? to Yes.

Use recipe for search results Select yes to use the recipe to find search results

Set up an is Search query present IF condition in Step 2.

This portion of the recipe enables type-ahead search.

Map the Search query | Step 1 datapill from Step 1 into the Data field.

Select is present from the Condition dropdown.

Configure an IF condition

Click + Add step to add an action to the Yes section of your IF condition. Select the HTTP Send request action.

Configure your Send request action

Provide a Request name. Workato uses this value to name your action.

Click Start guided setup.

Select GET as the HTTP Method.

Provide the Request URL. This is the URL from which you plan to make requests. For example, https://api.geoapify.com/v1/geocode/autocomplete.

Add request URL Provide the request URL

Click Next.

Under Request URL parameters, click Show. Then click Add URL parameter.

Enter text for the Parameter name and a sample location, such as Springville in the Value field.

Add a parameter

In the Response section, ensure the Response content type and Encoding fields are set to JSON and UTF-8, respectively.

Click Send request.

Review the HTTP configuration. Workato uses the Response from this call to auto-generate the response schema for this action.

Click Apply configuration.

In the Request URL parameters field, remove your sample location, Springville, and map the Search query | Step 1 datapill. This enables the recipe to query the API for the location your user types into the field.

Map in search query datapill Map in the search query datapill

Leave all other fields at their default values.

Click + Add step to add an app and action. Select the Workflow apps Return data to component action.

Configure the Return data to component action

In the Dropdown options source list field, map the Features | Step 4 datapill.

In the Value field, map the Formatted | Step 4 datapill.

Map in datapills

Click + Add step to add an action. Select the Else action. If no results match the search query, this portion of the recipe returns an empty value to your dropdown.

Click Save, and Exit. Then, return to your page to finish setting up this component.

Save value and label to data columns

View and test your page in the Apps portal.

# Limitations

Not all recipes can serve as a data source for dropdown components. Workflow apps support recipes as a data source if the recipe's total run time is ten seconds or less. This means this feature isn't compatible with recipes that use long-running actions. This limit prevents timeouts in your Workflow apps pages.

Additionally, during the limited access release, this feature is subject to the following limitations:

Workflow apps displays recipes for the project in which the app exists only. If you plan to use recipes from a separate project, you must move them into the same project as your app.
Workflow apps' preview mode does not support recipe dropdowns. This means that you must test recipe functionality in the apps portal itself.

Last updated: 10/1/2024, 12:08:53 AM