How to Visually Differentiate Active Filters from "Include All" (Change "Include All" Filter Style)
Introduction
Note: The solution was developed on the L2025.1 Sisense version (Linux).
This article addresses how to visually differentiate active filters from "Include All" filters in Sisense dashboards. Many users find it challenging to distinguish between active filters (filters with one or more values selected) and inactive ones that include all options. This guide provides a solution for making active filters more visually prominent, which is particularly beneficial when the dashboard supports multiple languages and thus cannot rely solely on text changes.
[ALT Text: A user interface showing filter options. The filters are labeled "Months in Date" with an option to "Include all," and "Region" with "Europe" selected. Each filter option has a toggle switch next to it. There is also a trash bin icon below the filters.]
[ALT text: Interface displaying filter options, including a dropdown menu labeled "Months in Date," a checkbox option titled "Include all" with an arrow pointing to it, and a section labeled "Region" with "Europe" highlighted in light blue.]
Step-by-Step Guide
- Insert this script into the Edit Script section by clicking the 3 dots menu on the dashboard level.
const hideIncludeAllFormattedLook = (scope, args) => {
const filterIncludeAllTitles = scope.filters.$$items.filter(f => f.jaql && f.jaql.filter.all).map(f => f.jaql.title)
const CfilterIncludeAllTitles = scope.filters.$$items.filter(f => f.levels && f.levels.find(l => l.filter.all))
CfilterIncludeAllTitles.forEach(f => {
f.levels.forEach(l => {
if (l.filter.all) {
filterIncludeAllTitles.push(l.title)
}
})
})
filterIncludeAllTitles.forEach(title => {
$('.f-mini-host').has(`span:contains(${title})`).find('.uc-tag').css('background-color', 'transparent');
})
}
dashboard.on('domready', hideIncludeAllFormattedLook)
- Save the changes and refresh the browser page.
- Check the dashboard to ensure that active filters with not all values selected are now visually distinct from the "Include All" filters.
Conclusion
By implementing the provided script, Sisense dashboard users can effectively differentiate between active filters and "Include All" filters, enhancing the user experience.
Disclaimer: This post outlines a potential custom workaround for a specific use case or provides instructions regarding a specific task. The solution may not work in all scenarios or Sisense versions, so we strongly recommend testing it in your environment before deployment. If you need further assistance with this please let us know.
