For instance, I made a test app that initially displays only one choice component. Then, after you make a choice, the second choice component becomes visible, and so on (there are a total of five choice components in the test app).
Current visibility logic:
Choice 1 - none (so always show choice 1)
Choice 2 - show component when Choice 1 is not empty
Choice 3 - show component when Choice 2 is not empty
Choice 4 - show component when Choice 3 is not empty
Choice 5 - show component when Choice 4 is not empty
This works (to a very minor degree, of just showing each next choice component when the previous one has been filled) but where it fails is when a user, for instance, has made choices for all five choice components. Then lets say the user clears their choice for Choice 3, then Choice 4 becomes hidden. There are more scenarios where things get similarly messy, but the general idea/logic that I’m trying to achieve is:
- It starts with one choice component, if that choice component gets filled, show the next choice component, and so on (un wind them).
- If a previous choice component (usually a middle one) gets cleared, keep the next choice component visible.
- So the only way that a choice component could become hidden again, is if its the last filled component and it was just cleared, and so on (wind back up).
Ideally it’d be great if there was some way for subsequent choice components (their data) to shift depending on if a previous choice component was cleared. So, for instance, if all 5 choice components are filled and therefore visible, and Choice 3 was just cleared, then the data in Choice 4 would shift to Choice 3, and the data in Choice 5 would shift to Choice 4, and Choice 5 would therefore be cleared of any data. This would allow the current visibility logic provided earlier in the post to work.
Any ideas/thoughts/implementations would be very helpful. Thanks.