Reset to Default Filters When Loading Dashboard
Purpose/Benefit
Sometimes it is convenient to always reset the filters to a default state when opening a dashboard. This post describes how to achieve this with a little bit of JavaScript. When users will often be resetting filters to a default state, it is also useful to have a more prominent button to do so. This post describes how to do this as well (optional).
Prerequisites
None
Steps
Step 1 - Open a dashboard & open the script editor
Open the options menu in the upper right corner of the dashboard and choose the Edit Script option (as shown below).
Note: It's not always desirable to do this for all dashboards, so these steps must be taken for each dashboard that you want to have this behavior.
Step 2 - Paste in the following code snippet and click save
window.resetFilters = function(d) { //Function to reset the dashboard filters to the default filters. Takes parameter 'd' which is a reference to the dashboard
d.filters.clear(); //Clears current filters
d.defaultFilters.forEach(function(filter, index){ //Loop through each default filter and apply to current dashboard filters
if(index != d.defaultFilters.length - 1){ //Does not refresh filter if it is not the last filter
d.filters.update(filter,{
save:true,
refresh:false,
unionIfSameDimensionAndSameType:true
});
}
else{//Only refresh dashboard on the last filter
d.filters.update(filter,{
save:true,
refresh:true,
unionIfSameDimensionAndSameType:true
});
}
})
}
dashboard.on('initialized', function(d){ //Resets filters to default when dashboard is first loaded (or refreshed)
resetFilters(prism.activeDashboard); //Resets filters
})
(Optional) Include this code snippet after the first to create a larger copy of the reset filters button on the toolbar. This may be convenient for some users.
dashboard.on('initialized', function(sender, ev){ //Adds filter reset button to the toolbar
toolbar = $('.actions-box'); //reference to top toolbar
resetButtonHTML = "<div id=\"toolbarResetButton\" class=\"btn-immutable btn-action\" onclick=\"resetFilters(prism.activeDashboard)\" data-ng-style=\"{height: sizing.toolbar.height, \'border-left-width\': sizing.atoms.midHgap + \'px\'}\" title=\"Restore my default filters\" style=\"height: 50px; border-left-width: 30px;\"><div style=\"background-image: url(../client/resources/ux-controls/images/refresh_48.png); height: 50px; width: 50px; background-repeat: no-repeat; background-position: center\"></div>"" //button HTML with reference to resetFilters() function
if($('div#toolbarResetButton').length == 0){ //Check to see if filter reset button already exists in DOM
toolbar.append(resetButtonHTML); //Adds filter reset button to DOM
}
})
Step 3 - Enjoy!
Your dashboard filters will now reset to their default state when a user opens the dashboard!
-
Another way to change the size and image of the reset filter button is to access the class of the button directly as follow during the Dashboard Initialized event:
dashboard.on('initialized', function(sender, ev){ //Adds filter reset button to the toolbar
$('.filters-global-header .filters-reset-button').css('width','50px');
$('.filters-global-header .filters-reset-button').css('height','50px');
$('.filters-global-header .filters-reset-button').css('background-image', 'url(../client/resources/ux-controls/images/refresh_48.png)');
})
-
Hi Antti,
You can use this article ,https://support.sisense.com/hc/en-us/community/posts/360015945013-Adding-Custom-Menu-Items-to-Dashboards , to add dashboard menu item, and just insert the reset filter reset code instead of the sample.
Best,
Ronen
-
Here is a dashboard script that just resets all filters (except for locked filters) to include all during dashboard initialization. Tested with dependent filters + locked filters + background filters.
dashboard.on('initialized', (el, args) => {
args.dashboard.filters.$$items.forEach((itemFilter) => {
if(itemFilter.locked === undefined || itemFilter.locked === false) { //Check if the filter is locked, so we don't reset it.
if(itemFilter.levels !== undefined) { //Check dependent filters
itemFilter.levels.forEach((depFilter) => {
depFilter.filter.members = undefined;
depFilter.filter.all = true;
depFilter.filter.explicit = false;
});
}
if(itemFilter.jaql !== undefined) { //reset normal filters
itemFilter.jaql.filter.members = undefined;
itemFilter.jaql.filter.all = true;
itemFilter.jaql.filter.explicit = false;
itemFilter.jaql.collapsed = true;
}
}
});
});Hope this helps!
Please sign in to leave a comment.
Comments
7 comments