Popup window using Dynamic Visibility Feature in Dashboard
Hi everyone,
Many times there are requirement to display popup window to show detail data when user click on summarize data. We can do the same in dashboard using component property i-e Dynamic visibility.
Dynamic visibility is a feature in dashboard which makes component to be hidden and displayed on certain condition.
In our scenario, data is fetched from BEx query using OLAP connection in which sales target and actual sales is showing. We have fetch data from two different query, one for summarize data and other for detail data. It is assuming that the data fetched and bound with excel columns. Suppose below is the data which we fetch.
Summarize Data Company Code wise |
Detail Data Company Code and Sales office wise |
||||||||
Month |
Comp Code |
Sales Plan |
Actual Sales |
Month |
Comp Code |
Sales Office |
Sales Plan |
Actual Sales |
|
Jan-15 |
1300 |
2500 |
2000 |
Jan-15 |
1300 |
1301 |
1000 |
700 |
|
Feb-15 |
1300 |
3200 |
2200 |
Jan-15 |
1300 |
1302 |
1000 |
955 |
|
Mar-15 |
1300 |
3800 |
2500 |
Jan-15 |
1300 |
1303 |
500 |
345 |
|
Apr-15 |
1300 |
4700 |
2544 |
Feb-15 |
1300 |
1301 |
1200 |
800 |
|
May-15 |
1300 |
2500 |
2000 |
Feb-15 |
1300 |
1302 |
2000 |
1400 |
|
Jun-15 |
1300 |
3200 |
2200 |
Mar-15 |
1300 |
1301 |
1400 |
900 |
|
Jul-15 |
1300 |
3800 |
2500 |
Mar-15 |
1300 |
1302 |
2400 |
1600 |
|
Aug-15 |
1300 |
4700 |
2544 |
Apr-15 |
1300 |
1301 |
1700 |
1100 |
|
Sep-15 |
1300 |
2500 |
2000 |
Apr-15 |
1300 |
1302 |
3000 |
1444 |
|
Oct-15 |
1300 |
3200 |
2200 |
May-15 |
1300 |
1301 |
1000 |
700 |
|
Nov-15 |
1300 |
3800 |
2500 |
May-15 |
1300 |
1302 |
1500 |
1300 |
|
Dec-15 |
1300 |
4700 |
2544 |
Jun-15 |
1300 |
1301 |
1200 |
800 |
|
Jun-15 |
1300 |
1302 |
2000 |
1400 |
|||||
Jul-15 |
1300 |
1301 |
1400 |
900 |
|||||
Jul-15 |
1300 |
1302 |
2400 |
1600 |
|||||
Aug-15 |
1300 |
1301 |
1700 |
1100 |
|||||
Aug-15 |
1300 |
1302 |
3000 |
1444 |
|||||
Sep-15 |
1300 |
1301 |
1000 |
700 |
|||||
Sep-15 |
1300 |
1302 |
1500 |
1300 |
|||||
Oct-15 |
1300 |
1301 |
1200 |
800 |
|||||
Oct-15 |
1300 |
1302 |
2000 |
1400 |
|||||
Nov-15 |
1300 |
1301 |
1400 |
900 |
|||||
Nov-15 |
1300 |
1302 |
2400 |
1600 |
|||||
Dec-15 |
1300 |
1301 |
1700 |
1100 |
|||||
Dec-15 |
1300 |
1302 |
3000 |
1444 |
As per above data, We have company code wise summarized data(fetched from Bex Query) and Company code and sales office wise detail data(fetched from other Bex query). Now when user clicks on any month on summarized data, the new popup window shows the detail data sales office wise for that selected month.
Step1: Take panel and Excel spreadsheet component on canvas, bind spreadsheet component with excel columns(which bound with First Bex Query).
Step2: Add one more column at left side and write ‘Show’ in it(It is use for Dynamic display).
Step3: In Data Insertion Property, select ‘Row’ as insertion type and give two columns (Newly added and Month column) as source data and give destination path. Refer below given screen shot of ‘Set property’ of spread sheet component.
Step5: Drag Panel to canvas, In New panel take spread sheet and push button component.
Step6: Bind New spread sheet component with details Bex query data and set Dynamic visibility property of panel-2 component.
Step7: Use push button to close popup window (Panel-2), Write ‘Close’ in Cell and give the same as source data and Cell ‘I4’ as destination. Refer below screen shot
Step8: Set Canvas and component size and position as per designing requirement and Execute Dashboard, It will shows only panel-1, when user will click it will popup new window as panel-2 and when pressed close button, new window will be closed.
Hope this doc will help to understand the dynamic popup window concept. I will appreciate suggestions and comments which help me to improve the Document.