My goal:
In a Retool Form, I have a Select A and a Select B. I want to filter the Select B options dynamically retrieved regarding what I previously selected in the Select A.
This in order to avoid multiply the form fields.
Issue:
I can dynamically retrieve some values from a table to populate the Select but unable to filter them.
A solution like the Cascader component available for Retool Forms would be amazing!
Are the values for both Selects coming from a single source? For example, you have a table/list of values: ['A', 'B', 'C', 'D', 'E']
Both Select A and Select B have this array of selections, but if someone were to choose a value in either component, the other would have to show what is left to choose from?
In this example, if I selected 'C' in Select A, then the choices in Select B should be: ['A', 'B', 'D', 'E']
I don't think this is the use case I'm talking about unfortunately.
Each Select would have his own list of values, and a value selected in Select A would filter the list of Select B as Select B values could be considered like children of Select A values.
Perfect! This helps me understand the structure of your data a bit better.
I believe you want to explore something like an object which uses root keys to be the selection values for Select A and the values would be an array of options for Select B.
Consider the A B C D E array from my last post, but visualize it as a JS Object instead (I'm going to call it options:
I think there is a misunderstanding here I'm sorry. I was talking about Retool Forms, not using a form component in a Retool App.
With Retool Forms, as far as I know, it isn't possible to use a dynamic data source using Javascript. I can only use Manual options or Dynamic values from a Resource. In my case, a Retool DB table field.
Hi @sacha,
In Retool Forms, Select fields can only use manual options or dynamic values from a connected resource β unfortunately, custom JavaScript filtering isnβt supported at the moment.
A simple workaround:
You can create a separate Select B field for each possible value of Select A, and use visibility rules to display the right one based on the userβs selection.
Itβs not ideal for complex forms, but it works well enough in straightforward cases.