Problem Statement

To add dual stage popups along with text inputs, text labels or buttons or any other control. This method can be used to add multi-stage popups, and not just dual popup

High level resolution steps

• We make use of the concept of Parent Child containers in this process.
• Add parent container first and add child container within parent container, for the next stage of popup – child container will become the parent this time and add another container within this popup.

Detailed resolution steps

Step 1 –Add a button and set a local variable as true in the onSelect property as shown in below picture.

Step 2 – Add a parent container now as shown in the below picture and give the fill property of the parent container to RGBA (169, 169, 169, 0.75) so that it gives the blur effect when the popup appears.

Step 3 – Inside the Parent container add the child container and in child container add another button and give some text label as you wish as seen in the below picture:

Step 4 – Now on click of the button “open second popup” set another local variable as false in the on-select property of the button as shown below:

Step 5 – Set the visible property of “Child Container 2” as showsecondpop and don’t modify the fill property of the “child container” as shown in the below picture:

Step 6 – Now on click of “open second popup” button, the second popup will open, change the color or keep It as you wish and give visible property of “child container2” as the variable you set on click of “open second popup” button.

Step 7 – On click of “go back” button, update the variable as false – so that it goes back to first popup.

Output: