$.guruTools.grouping

$.guruTools.grouping

Introduced in platform version 4.2.0
Minimum platform version (update can be downloaded) 4.2.0

This feature renders some buttons inside a text element to control the grouping of a single visualization.

This feature has the following settings:

Setting Default value Description
elContId [REQUIRED INPUT]

This is the dashboard unique ID of the elementContainer to control (eg. elContainer_1)

TIP:
The element container id can be found by inspecting the elementcontainer dialog html or parameter element in action tab with Chrome developer tools

buttonsSelector #groupingButtons

This is the selector which should match the DIV where the buttons should be rendered

# = ID
.  = css class

singleSelectOverride true

true = group on only one column at a time
false = group on additional columns on every click. Click on grouped column removes column from grouping columns

optionFilter ""

Filters which columns that should be available as buttons. 
Multiple columns seperated by pipe (|)
No filter (default) shows all columns availabe for grouping
ATTN: use column name (not localized name)

orientation horizontal Horizontal or vertical rendering of buttons
staticOptions array

New in 4.2.3

Array of column names that always should stay grouped
(even when they are not represented as buttons and when singleSelectOverride = true)

sortByGrouped false

New in 5.3

When set to true sorting will be overidden by grouped columns. 

Example:

<script type="text/javascript">
$(document).ready(function(){

 var config = $.guruTools.grouping.getConfig("elContainer_1");
config.buttonsSelector = "#groupingButtons1";
config.optionFilter = "usergroupName|personname|contactName";
config.singleSelectOverride = "true";

 $.guruTools.grouping.initialize(config);
});
</script>

<label id="groupingLabel1" style="width: 99%; font-size: 2em; border-bottom: 1px dotted #f0f0f0;">Grouping</label>
<br/>
<div id="groupingButtons1"></div>

The LABEL with ID "groupingLabel1" is simply a label that says "Grouping"
The DIV with ID "groupingButtons1" is a container for all the grouping buttons that are going to be rendered