Filter Component Add-in Reference

Accordion addIn

If you a have a group of related filters, you might want to have them behave as an accordion: whenever a filter is opened, the remaining filters should close themselves.

Implementation

This addIn acts on the slot postUpdate, which runs when data is imported into the filter's model. The addIn works by hooking a callback to an event emitted by model whenever the filter is expanded/collapsed.
Whenever the user expands a filter, a global event on the "Dashboards" object is issued. The remaining filters configured to use this addIn will listen to the event. If they share the same "group", they will close themselves accordingly.

Reference

To override the default configuration of the addIn, add the following snippet to the filter's preExecution callback:

			this.setAddInOptions('postUpdate', 'accordion', {
				group: 'myGroup' // Name of the group whose this filter belongs to
			});
		

Also, add the following CSS. Note that .filter-accordion is the CSS class of a container that holds the group of filters

			
		.filter-accordion .filter-root-body{
			position: relative; /* we want the filters to expand */
		}
		

Example