The Tabber add-on creates a new widget that allows you to switch between views easily and quickly without changing the dashboard.

Tabber Widget can be used to view data in different time zone (Current Month , Last Month) or to view data in different categories (Revenues, Sales,Orders ).

tabber

This widget is designed to be used only once per dashboard.

Note: The Tabber add-on does not support saving the Tabber state after refreshes or filter changes.

To install the Tabber add-on:

  1. Download the attachment and unzip the contents into your C:\Program Files\Sisense\PrismWeb\plugins\ folder. If the plugins folder doesn’t exist, just create it. After those files have been unzipped there, you may also have to restart the web server.
  2. In the Sisense Web Application, create a new widget. The Tabber widget is displayed in the list of options.
    tabber1
  3. Click Apply to create the widget.
  4. Open the script editor of the Tabber widget.
    editscript
  5. Paste the following code into the script editor.
    widget.on('render',function(w, e){e.prefixText = '';
    				   e.suffixText = '';
    				   e.selectedColor = '#86b817'; /*The color of the chosen title*/
    				   e.fontColor = '#cccccc'; /*The color of the unchosen titles*/
    				   e.elementWidth = '103%';
    				   e.descColor = '#a5a5a5';
    				   e.parentMarginLeft = '-15px';
    				   e.height = 32; /* affects the tabber widget default high*/
    								 });
    widget.tabs = [{title: "Column Chart", displayWidgetIds : ["55797a9459ef031011000032"], 
                    hideWidgetIds : ["557d408a4630ccdc11000019"]},
                   {title: "Table", displayWidgetIds : ["557d408a4630ccdc11000019"], 
                    hideWidgetIds : ["55797a9459ef031011000032"]
    			  ];
  6. Each row represents a different tab. The order of the tabs is according to the rows as the appear in the code.
    displayWidgetIds: Within the [] , write all the widgets ID’s you wish to display under the specific tab in “”, separated by comma.
    hideWidgetIds: In the [] write all the widgets ID’s you wish to hide from the specific tab in “”, separated by comma. The widget ID appears in the widget URL. You can view the URL when editing a widget. The widget ID is displayed at the end of the widget URL, for example: http://localhost:8081/app/main#/dashboards/55797a3542f03101100002c/widgets/55797a9459ef031011000032. The widget ID is: 55797a9459ef031011000032.
    You can change the Tabber design such as the font color. See the available options as comments in the code example above.
  7. Click Save and close the window.
  8. Refresh the widget and click Apply.
  9. To place multiple widgets under one tab, copy the JavaScript code below into the script editor at the end of your script and save the changes:
     widget.tabsConfig = 'multiply'