Skip to main content
Solved

Conditionals


Rosana

Anyone knows how to create a conditional navigation in Figma using a “single-select option” component, and a “next” button which directs to different pages based on the selected option from the single-select component?

Best answer by Vishal_Ramawat

That’s completely fine. Instead of Dropdown values, you change the variable on press of Filters (Single choice components).
Let’s say, on click of Careers you set the Variable selectedOption to “Career”.
Then use Next button to match the selectedOption and Navigate further.

View original
This topic has been closed for replies.

5 replies

Vishal_Ramawat

Create a Variable for Select.
Bind this to Text in your Select.
In dropdown of Select, change variable to selected option.
On Next button, use conditional Navigation.


Rosana
  • Author
  • 2 replies
  • April 8, 2024

Hi @Vishal_Ramawat thanks so much for your answer. I can see your solution is when we create a dropdown select option and your use of the conditional is great, I will keep this in mind when doing a dropdown.

The issue I’m referring is related to when you have a set of buttons to choose a single option, then you will click on next. In my flow I cannot assign a “selectedOption” to a text as I dont have a dropdown. Please see my screenshot below and let me know how you will do this.


Vishal_Ramawat

That’s completely fine. Instead of Dropdown values, you change the variable on press of Filters (Single choice components).
Let’s say, on click of Careers you set the Variable selectedOption to “Career”.
Then use Next button to match the selectedOption and Navigate further.


Rosana
  • Author
  • 2 replies
  • April 8, 2024

Hi @Vishal_Ramawat I’ve tried your solution and works really well. I’ve applied your recommendation and also I’ve hide the “select” text so is not visibile but still works! Huge thanks 😀


Vishal_Ramawat

Glad you found the solution!
PS: Don’t forget to mark the solution 😀


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings