3-Step Wizard

[Syeds]

My goal is the create a 3 step procosess with the next step disabled until the previous step is completed.

Step 01- dropdown menu

Step 02- check box
Step 03- download button

I have managed step 01 and step 02 but I am not sure how I can keep the button at a disabled state and enable it via a checkbox tap. Any examples or advice?

[AkinGn · Accepted solution]

Hi @Syeds , I suggest you to connect the checkbox button to another artboard or you can create a big component that has checkbox and the button as groups, maybe this video I recently created to solve another problem can help: https://www.youtube.com/watch?v=yDFVcSVaUrg  (and the sample file I used there can be found here: https://www.dropbox.com/s/88dqqex080czf8n/submit-buttons-to-different-pages.xd?dl=0 )

You can ceate two buttons side by side, one is the disabled and one is the active/default one, and mask the group to make the disabled one visible, and once the checkbox is tapped, you can slide the disabled one to make the active one visible (by going to the big component's other state, triggered by that tap). Hope this helps!

[Syeds]

Thank you.