Skip to main content
Announcements
Qlik Introduces a New Era of Visualization! READ ALL ABOUT IT
cancel
Showing results for 
Search instead for 
Did you mean: 
srujanaponnuru
Creator
Creator

button show/hide

Hi All,

I have a requirement as below.

There are three buttons.

Button1

Button2

Button3

Each button has set of questions in a text box. 

when i click on Button1, only the button1 questions need to display in the text box.

when i click on button2 , only the button2 questions need to display below in the text box. similarly for button 3. 

and when i click on button 2 , button1 questions need to hide. 

how do i achieve this ?

 

Labels (1)
1 Solution

Accepted Solutions
anthonyj
Creator III
Creator III

Hi @srujanaponnuru ,

I'm going to run through the steps you can follow to achieve your requirements. It works using variables and the container object that allows you to show/hide objects based on conditions. The good thing about this is that your questions occupy the same space in your app which saves space on the canvas:

1: Create 3 variables in the variables viewer (vButton1, vButton2, vButton3) and assign them the value of zero as numeric (0) for FALSE.

2: Add the first button to your sheet and name it.

3: In the "Actions and navigation" property choose the action "Set variable value" and choose the first variable (vButton1)

4: In the "Value" section, open the fx and add =NOT(vButton1) (This will change the variable value from 0 to -1 and back again each time it is pushed)

5: Add two more "Set variable value" for vButton2 and vButton3 and the values for these are set to 0 (zero). This hard codes button 2 and button 3 back to 0 and hides them as per your requirement.

6: Copy and paste the button so you don't need to go through this again. Change the names for button 2 and 3. Change around the logic so pushing button 2 will assign vButton2 to =NOT(vButton2) and hard code vButton1 to 0.

7: Do the same for button 3. (Setting vButton1 and vButton2 to 0)

8: Add a container object to your canvas and take your 3 question text boxes and put them in the container. The container allows for show/hide based on conditions. This is where you can set your variable values to TRUE/FALSE based the button pushed.

9: In the properties of the container object on question 1 add: =vButton1 = -1. Repeat for questions 2 and 3 with vButton2 and vButton3

The result will be like below example

anthonyj_0-1649048592020.png

anthonyj_1-1649048622757.png

I hope this helps.

Thanks

Anthony

 

View solution in original post

2 Replies
anthonyj
Creator III
Creator III

Hi @srujanaponnuru ,

I'm going to run through the steps you can follow to achieve your requirements. It works using variables and the container object that allows you to show/hide objects based on conditions. The good thing about this is that your questions occupy the same space in your app which saves space on the canvas:

1: Create 3 variables in the variables viewer (vButton1, vButton2, vButton3) and assign them the value of zero as numeric (0) for FALSE.

2: Add the first button to your sheet and name it.

3: In the "Actions and navigation" property choose the action "Set variable value" and choose the first variable (vButton1)

4: In the "Value" section, open the fx and add =NOT(vButton1) (This will change the variable value from 0 to -1 and back again each time it is pushed)

5: Add two more "Set variable value" for vButton2 and vButton3 and the values for these are set to 0 (zero). This hard codes button 2 and button 3 back to 0 and hides them as per your requirement.

6: Copy and paste the button so you don't need to go through this again. Change the names for button 2 and 3. Change around the logic so pushing button 2 will assign vButton2 to =NOT(vButton2) and hard code vButton1 to 0.

7: Do the same for button 3. (Setting vButton1 and vButton2 to 0)

8: Add a container object to your canvas and take your 3 question text boxes and put them in the container. The container allows for show/hide based on conditions. This is where you can set your variable values to TRUE/FALSE based the button pushed.

9: In the properties of the container object on question 1 add: =vButton1 = -1. Repeat for questions 2 and 3 with vButton2 and vButton3

The result will be like below example

anthonyj_0-1649048592020.png

anthonyj_1-1649048622757.png

I hope this helps.

Thanks

Anthony

 

srujanaponnuru
Creator
Creator
Author

Thank you Anthony. It worked.