Forum Discussion

MuznahM's avatar
MuznahM
Cloud Apps
08-16-2024
Solved

How do we change the time period if we are using "Dashboard Filters (by Filter name)"?

    How do we change the time period if we are using "Dashboard Filters (by Filter name)"? For example, I made separate date range buttons linked to dashboard date range filters such as “Last 9...
  • ILLIA's avatar
    08-23-2024

    MuznahM Greetings
    As per our thread in the ticket, will also attach custom action implementation here:

    Custom action name: setFilterWithLevel

    Custom action code:

     

    let itemArr = prism.activeDashboard.filters.$$items;
    let OurFilter = itemArr.find(function (x) {
        return x.jaql && x.jaql.title === payload.data.filters[0].filterName
    });
    OurFilter.jaql.level = payload.data.level;
    OurFilter.jaql.filter = payload.data.filters[0].filterJaql;
    payload.widget.dashboard.filters.update(OurFilter, {save:true, refresh: true});

     

    Custom action accepted values (not necessary to specify particular values): 

     

    {
        "type": "setFilterWithLevel",
        "title": "title"
    }

     

     Custom action usage example:

     

    {
        "title": "Last 30 Days",
        "type": "setFilterWithLevel",
        "data": {
            "level": "days",
            "filters": [
                {
                    "filterName": "Date Range",
                    "filterJaql": {
                        "selectedVal": "2",
                        "last": {
                            "count": 30,
                            "offset": 1
                        },
                        "multiSelection": true
                    }
                }
            ]
        }
    }

     

    Now level can be passed in the filter using pretty much same syntax as default OOTB action for filters.

    Best regards,

     

  • MuznahM's avatar
    08-23-2024

    Hi ILLIA ,

    It’s working as expected now. Thank you so much for providing such a great solution.

    I have one more question: Is it possible to sync both the custom button filter (as mentioned in the previous ticket) and the dashboard filter, specifically the "from" and "to" date range filters?

    I tried using a script, but it didn’t work as expected. I’ve made some modifications to the solution you provided, which successfully changes the button color when selected.

    // Holds the chosen granularity from the selected button 'months' for example
    const dategran = payload.title;
    //Change the background color for unselected buttons
    payload.widget.style.currentCard.body[0].items[0].columns[0].items[0].actions.forEach(function (i) {
        i.style["background-color"] = '#D3D3D3'
    })
    
    //Change the background color for selected buttons
    payload.widget.style.currentCard.body[0].items[0].columns[0].items[0].actions.filter(i => i.title == dategran)[0].style["background-color"] = "#1D426C"
    
    //Redraw the changes
    payload.widget.redraw()
    
    let itemArr = prism.activeDashboard.filters.$$items;
    let OurFilter = itemArr.find(function (x) {
        return x.jaql && x.jaql.title === payload.data.filters[0].filterName
    });
    OurFilter.jaql.level = payload.data.level;
    OurFilter.jaql.filter = payload.data.filters[0].filterJaql;
    payload.widget.dashboard.filters.update(OurFilter, {save:true, refresh: true});


    However, I want to implement two additional modifications:

    1. When editing the dashboard filter (e.g., changing the date range from "Last 90 days" in the custom filter to "Last 1 month" using the date range filter), I need the custom filter button selection to automatically switch to "Last 1 month."

    2. If I select a filter option that isn’t available in the custom filter buttons, I need all the buttons to be deselected.

    Is it possible to achieve this scenario using a script?

    Thank you for your assistance.

    Best Regards,
    Muznah Musthafa