Choosing dropdown option from icon

Hi,

I’ve been struggling with this issue for over a week and I am about to give up. My issue is pretty simple (or at least I think it should be): I want to be able to choose options in a dropdown menu by clicking an icon. The options are static choices. So lets say I have an icon on my page of an apple. I click the apple icon - the dropdown option is then changed to apple. I have been trying to use custom states and all that but it does not work. I’ve been reading other topics on the forum on similar issues but none of the responses there helped me. The closest I’ve been is when I put a conditional on the dropdown that when the apple icon is pressed, the default value of the dropdown is apple. But as you know, it only changes for a split second when you press the icon.

I would really appreciate your help on this one. I feel like this SHOULD be super easy, and maybe it is? I feel like I’ve been trying everything but nothing seems to work.

1 Like

If you’re using a dropdown, just create an Action that can detect when that input has changed, and set a state to that changed value. In your Conditions, add a condition that follows that state, and do something.

Thanks for your reply!

Would you mind being a little bit more specific? What type of action? And the “set a state”-thing, how would you go about that? As I mentioned in my original post, having a custom state and setting that to something different has not worked.

chrome_UtF1YKijqB

chrome_8rptRTanrX

chrome_2npFS4pSjg

chrome_1mTfzGY0hc

And bam. Result.

Ah, sorry mate. I think I didn’t explain it good enough. What you just explained is to change the icon according to the dropdown choice, right? I want the icon to always be there, and when I click the icon the dropdown changes. Not the icon. So the icon is pretty much a shortcut to the dropdown. So, click the apple icon - the dropdown changes to the choice apple. Not the other way around

Kind of the same logic. Instead of changing the Icon, change the option selected. You can do that by using “Initial content”. The best way is to add a data set. Using options with an “apple” in a list, you can add the apple to a list of things when it’s selected. The dropdown would be dynamic instead of static, with the option set selected, filtered with your dropdowns constraint.

Still can’t get it to work. So I’ve added options set with options like apple, banana etc and the dropdown is now showing these options. I now want to click on the apple icon (outside of the dropdown, different place on the page) to set the value of the dropdown to “apple”.

hey @jacob.franss,
is this what you’e trying to do? can’t think of the use case though
forums14622
I’ll write down the steps for you

  1. first, you need to add the dropdown with the static options.
  2. Add a custom state to the dropdown to indicate the option selected.
  3. set the default value of the dropdown to equal the custom state
  4. then for each icon, you need to add this workflow to set the correct action (it must be the same exact spelling)

    done.
1 Like

Wow, thank you! It works. Almost. So when I click the icon the dropdown changes, exactly like I wanted. But if I choose an option in the dropdown manually and then click the icon, nothing happens. Do you understand what I mean? How do I fix this?

Sorry if the explanation wasn’t sufficient. What I mean is if I first click the copy icon it works. If I then click the dropdown and click on the option edit in the dropdown and then click on the copy icon again, it doesn’t change.

You’ll need to apply my first suggestion’s logic.

ah no worries, I assumed you can only use the icons. You can either apply @GH5T logic or simply group the dropdown and add a second step that resets the group after the dropdown value changes.


the workflow

in action:
ezgif.com-gif-maker (1)

Thank you so much! It works. Made my day.

1 Like