We’ve launched a brand new, Filtered typehead screen template to enable you to select a first option from the data source and filter the second option accordingly.
How do I use this screen template?
You can use this screen to add a form with a dropdown containing values from a data source, eg you can add a data source that includes the Regions and Countries, when you select the main region, eg Europe, you will only see the list of European countries in the second dropdown.
What does this screen template do?
This screen template easily lets you add a form with typehead fields containing data from a data source that allows you to use the first option as a filter and the second option will only display the relevant entries.
This is super useful as you don’t need to update the values in the dropdowns manually, these will be dynamically added from the selected data source.
How do I customize this screen template?
You can update the form accordingly, for more information on how to update the form component, refer to this article.
let dataSourceName = 'Countries'; // update the ‘Countries’ text with your data source name
let mainTypeaheadField = 'Region'; // update the ‘Region’ text with your column name, note that this is the main selector, selecting this option will filter the secondaryTypeheadField options
let secondaryTypeahedField = 'Country'; // update the ‘Country’ text with your column name, note that these options will be pre-filtered according to what is selected on the mainTypeheadField variable
let groupedBy = 'Region'; // update the ‘Region’ text with your column name, note that this option should be the same as the mainTypeheadField
let secondaryTypeahedColumnName = 'Country'; //update the ‘Country’ text with your column name, note that this option should be the same as the secondaryTypeahedField