Forum Discussion

jeffreyl's avatar
jeffreyl
Cloud Apps
08-12-2022
Solved

Code example using Blox dropdown to select dashboards

I have been searching the web for a couple of days with no success. I need a code example using Blox dropdown to select dashboards. I have 10 regional locations, each will have a set of dashboards. I am able to create and use 10 buttons on a dashboard but it would be cleaner and better if I can use a dropdown to open the url and go to the selected regional dashboard. I am thinking I need to use an Action Set but have not figured out how to make it work with a Blox dropdown or a radio button. I have found dropdown filter examples but have not been able to translate that to calling the action goto url.

  • Hi jeffreyl ,

    Try this blox script:

    1.  Create blox using below script (replace Dasboard1 URL and Dashboard2 URL with actual URLs):

     

     

    {
        "style": {},
        "script": "",
        "title": "",
        "titleStyle": [
            {
                "display": ""
            }
        ],
        "showCarousel": true,
        "carouselAnimation": {
            "showButtons": false
        },
        "body": [
            {
                "type": "Container"
            },
            {
                "type": "ColumnSet",
                "separator": false,
                "spacing": "default",
                "columns": [
                    {
                        "type": "Column",
                        "width": "170px",
                        "items": [
                            {
                                "type": "TextBlock",
                                "size": "small",
                                "weight": "regular",
                                "wrap": true,
                                "class": "checkboxVal",
                                "text": "Choose Dasbhoard"
                            }
                        ]
                    },
                    {
                        "type": "Column",
                        "spacing": "none",
                        "width": "175px",
                        "items": [
                            {
                                "type": "Container",
                                "spacing": "none",
                                "items": [
                                    {
                                        "type": "Input.ChoiceSet",
                                        "id": "selectVal",
                                        "class": "",
                                        "displayType": "compact",
                                        "value": "",
                                        "choices": [
                                            {
                                                "title": "Dasboard1",
                                                "value": "Dasboard1 URL"
                                            },
                                            {
                                                "title": "Dashboard2",
                                                "value": "Dashboard2 URL"
                                            }
                                        ]
                                    }
                                ]
                            }
                        ]
                    },
                    {
                        "type": "Column",
                        "spacing": "none",
                        "width": "175px",
                        "items": [
                            {
                                "type": "Container",
                                "spacing": "none",
                                "items": [
                                    {
                                        "type": "ActionSet",
                                        "actions": [
                                            {
                                                "type": "openDashboardAction",
                                                "title": "Open"
                                            }
                                        ]
                                    }
                                ]
                            }
                        ]
                    }
                ]
            }
        ],
        "actions": []
    }

     

     

    2. Create an action 'openDashboardAction' with below script:

     

     

    dashboardURL = payload.data.selectVal
    window.open(dashboardURL, '_blank').focus();

     

    -Hari

     

3 Replies

Replies have been turned off for this discussion
  • harikm007's avatar
    harikm007
    Data Warehouse

    Hi jeffreyl ,

    Try this blox script:

    1.  Create blox using below script (replace Dasboard1 URL and Dashboard2 URL with actual URLs):

     

     

    {
        "style": {},
        "script": "",
        "title": "",
        "titleStyle": [
            {
                "display": ""
            }
        ],
        "showCarousel": true,
        "carouselAnimation": {
            "showButtons": false
        },
        "body": [
            {
                "type": "Container"
            },
            {
                "type": "ColumnSet",
                "separator": false,
                "spacing": "default",
                "columns": [
                    {
                        "type": "Column",
                        "width": "170px",
                        "items": [
                            {
                                "type": "TextBlock",
                                "size": "small",
                                "weight": "regular",
                                "wrap": true,
                                "class": "checkboxVal",
                                "text": "Choose Dasbhoard"
                            }
                        ]
                    },
                    {
                        "type": "Column",
                        "spacing": "none",
                        "width": "175px",
                        "items": [
                            {
                                "type": "Container",
                                "spacing": "none",
                                "items": [
                                    {
                                        "type": "Input.ChoiceSet",
                                        "id": "selectVal",
                                        "class": "",
                                        "displayType": "compact",
                                        "value": "",
                                        "choices": [
                                            {
                                                "title": "Dasboard1",
                                                "value": "Dasboard1 URL"
                                            },
                                            {
                                                "title": "Dashboard2",
                                                "value": "Dashboard2 URL"
                                            }
                                        ]
                                    }
                                ]
                            }
                        ]
                    },
                    {
                        "type": "Column",
                        "spacing": "none",
                        "width": "175px",
                        "items": [
                            {
                                "type": "Container",
                                "spacing": "none",
                                "items": [
                                    {
                                        "type": "ActionSet",
                                        "actions": [
                                            {
                                                "type": "openDashboardAction",
                                                "title": "Open"
                                            }
                                        ]
                                    }
                                ]
                            }
                        ]
                    }
                ]
            }
        ],
        "actions": []
    }

     

     

    2. Create an action 'openDashboardAction' with below script:

     

     

    dashboardURL = payload.data.selectVal
    window.open(dashboardURL, '_blank').focus();

     

    -Hari

     

    • bpeikes's avatar
      bpeikes
      Cloud Apps

      Great response. Had a couple questions:

      1) How did you know that you have to set "displayType":"compact" to get a dropdown to render correctly? The only place that I see that in the Blox documentation is in the one code sample for Dynamic Inputs. In the docs for "Dropdown", all it says is that it's id has to be "selectVal".
      2) What do you do if you want more than one dropdown? ie. what is the id? The documentation says that it has to be "selectVal", yet in my tests, using just "type", and "displayType" are enough to force a render to a dropdown. 

  • harikm007 If I want to apply all the filters selected in my parent dashboard when I hit open action button, how should the code be modified. Currently it will just open the dashboard and not apply any filters.