Use the Toggle component to show/hide responses
This page outlines how to use the Toggle component to show FAQ responses when the add icon next to a question is clicked:
Note These steps complete the process for the first FAQ in the application.
- 1.Navigate to the Logic view, and open the Explorer panel.
- 2.In the Logic Flows section, click the Add a logic flow icon to add a new logic flow.
- 3.Name the logic flow to match the FAQ you want to add. For the first FAQ, name the logic flow
FAQ 1
. - 4.Drag-and-drop the following references into the application:
- Icon
- Answer 1
- 5.Select Icon to open the quick selection Actions menu, and add the onClick action to the component.
- 6.Drag-and-drop a Toggle component into the application.
- 7.Build the following node connections:
- Icon
onClick
> Toggletoggle
: Calls the Toggle component when the icon is clicked. - Toggle
onIfFalse
> Answer 1deactivate
: Deactivates the Answer 1 container when the Toggle is set to false. - Toggle
onIfTrue
> Answer 1activate
: Activates the Answer 1 container when the Toggle is set to false.
- 8.Repeat steps 1-7 for each FAQ in your application.
- 9.Test your application. When you click the add icon next to an FAQ, the corresponding answer should appear.
Congratulations! You just created an FAQ page.