Forum Discussion

rholmesminton's avatar
rholmesminton
Cloud Apps
01-28-2026

Set a background dashboard filter using Javascript

I am trying to set a background dashboard filter using JavaScript. Any suggestions?

 

3 Replies

  • Thalita_Santos's avatar
    Thalita_Santos
    Sisense Employee

    Hi!
    Can I ask you to provide some further details on the use case so we can better assist you in achieving what you want through a script? I wrote a community article on How to apply widget filters through code with SisenseJS that could be useful as an example if you want to just manipulate filters through code. This article could also possibly help with your request.

    The logic would also work in widget/dashboard scripts (manipulate JAQL filter object and apply it in the widget/dashboard), and in this example, I develop an entire filter panel from scratch, including the UI and JAQL filter applying logic, to serve as an example for those looking for something with this level of customization. Let me know if this helps or if you're maybe looking for something different.

  • Thalita_Santos,

    Thank you for your offer to assist me. First, I set the dashboard filter as a background filter and then I was able to use JavaScript to update the custom script for the dashboard filter when the widget first loads. Now, I need to have the custom script change based on the tab that is selected in the tabber widget. Can you help me with that?

  • Thalita_Santos's avatar
    Thalita_Santos
    Sisense Employee

    Hi rholmesminton​,

    Thank you for your follow-up question. There's no such on-change event on tabber, so to achieve the desired result, you would need to rely on HTML manipulation. For example, you can do something similar to this code snippet and then customize it according to your needs by inserting your filter change logic inside the setFilter function.

    Be aware that this kind of custom solution needs maintenance, since HTML may change within new Sisense versions, so it is not guaranteed that this will work for all versions.

    // Map each tab to the Brand value you want to filter by
    var tabFilterMapping = {
      'TAB 1': 'YourFilterValue', // This can be an array or any values you need to pass to your setFilter function to be able to apply your custom filter logic
      'TAB 2': 'YourFilterValue'
    };
    
    function setFilter(value, tabName) {
      // Your logic to change filters
    }
    
    widget.on('ready', function(scope, args) {
      // On initial load, apply filter for the default tab
      var defaultTab = scope.style.tabs[scope.style.activeTab].title;
      var defaultValue = tabFilterMapping[defaultTab];
      if (defaultValue) {
        setFilter(defaultValue, defaultTab);
      }
    
      // On tab click, apply filter only if a new tab is selected
      $('.listItemContainer', element).on('click', function(e){
        var selectedTab = $(e.currentTarget).text().trim();
        var filterValue = tabFilterMapping[selectedTab];
        if (filterValue) {
          setFilter(filterValue, selectedTab);
        }
      });
    });

    Does this help with your request? Please let me know if you have any other doubts, and I will be happy to help!