Any tricks getting a dropdown to accept a custom value when "allow custom values" is ticked?

I have a dropdown that takes an array of values and labels from a query. But I want to be able to type in a custom value in some cases. So I ticked the Allow custom values checkbox in the dropdown settings - but it still won't "take" a custom value that is typed in, after pressing enter or taking the focus away from the dropdown element.

Is there something I'm missing here ?

The multiselect component has an option of “allow user defined values” in addition to the allow custom values option, and they behave slightly differently.

Allow custom values: if the .value of the component is not present inside of the array of options, display it anyways. This could be set by .setValue or the initial value setting of the component.

Allow user defined values (multiselect)- users can select their search value as an additional option. Allow custom values doesn’t need to be enabled for this to work at the moment

We definitely need to add the same Allow user defined values functionality to the dropdown, at the moment the best workaround is to set the values array to something like [1,2,3].concat(select1.searchValue) which would add the searchValue (the user input) to the array of options to select.

3 Likes

@alex-w Can you guys provide with a good example for this? I am not sure when to trigger [1,2,3].concat(select1.searchValue).

We've now update the dropdown component to have the same "Allow custom values" functionality that the multiselect has! When this is selected, you can type any input into the dropdown and have that appended as another option when selected.

1 Like

@alex-w Hi, Alex. How to distinguish whether the value is custom or coming from mapped value?
I created at custom script where I need to check options value from dropdown. If the value is coming from query e.g. "id" then I'm gonna trigger API A, when the value is custom, then I'm gonna trigger API B.
Thanks

Hey Rony, could you confirm which version of retool you are deployed on? This topic is about 1 1/2 years old and custom values are no longer supported in this fashion. We do still allow custom values now via table tags, but they are stored in the table

I'd like to test this on the same version as you so that I can give you a more accurate solution by looking at how custom values vs mapped values are saved in the left panel (state tab) in this version to confirm how this might be done.

Theoretically, depending on your values you could add an extra string onto the end of your value when you map it, to confirm if it was queryA or not e.g:


I'm assuming custom values will have the same value as their label, thus if the result has queryA in the string, then you can trigger API A etc.