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?
Answer
Conditionals
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.
This topic has been closed for replies.
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.
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.
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.
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 😀
Glad you found the solution!
PS: Don’t forget to mark the solution 😀
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.