Friday, May 30, 2014

Multilevel Dashboard Tabs in OBIEE 11g (Creating sub-tabs in dashboard)

In OBIEE 11g, we can have only a single level of dashboard tabs.
We created tabs on dashboard tabs we can see them in linear manner on dashboard.

But we cannot have sub-tabs to any dashboard tab.
For Example,



In this example I will explain how we can create subtabs within a dashboard tab.
In this workaround we just creating an illusion of multilevel tabs but in fact they are 2 different dashboards merged one into other create multilevel tabs.

In my example ‘Product’ tab of parent dashboard has 3 sub levels as ‘Level1’, ‘Level2’, and ‘Level3’.
So we will create our first dashboard which is nothing but a parent dashboard. We will create a tab named ‘Product’.



We will create one more dashboard i.e. child that will contain 3 sub-tabs as Level1, Level2 and Level3.




Add text object in ‘Product’ tab of parent dashboard. Add following script to dashboard and select ‘contains HTML markup’.

<iframe frameborder="0" MARGINWIDTH="0"  MARGINHEIGHT="0" scrolling="no" width="100%" height="1200"   src="Child Dashboard Path "></iframe>

In src property we need to add webpage path of child dashboard containing three sub-tabs.

Now execute the parent dashboard.
On executing the dashboard, you will be able to see Child dashboard being merged into parent dashboard. But we do not wish to see the OBIEE header, child dashboard title and header links.

To remove these links from child dashboard add text object in all tabs and select ‘contains HTML markup’. Then add following script,

<script type="text/javascript">
var tds = document.getElementsByTagName('table');
for (var td = 0; td < tds.length; td++) {
if (tds[td].className != 'HeaderTopBar' && tds[td].className != 'HeaderSecondBar' ) {
continue;
}
if (tds[td].className == 'HeaderTopBar') {
var x = tds[td].parentNode;
x.removeChild(tds[td]);}
if (tds[td].className == 'HeaderSecondBar HeaderSecondBarPadding' || tds[td].className == 'HeaderSecondBar HeaderSecondBarMargin') {
var x = tds[td].parentNode;
x.removeChild(tds[td]);}
}
</script>

This script disables the header objects of child dashboard.
Run the parent dashboard and you will be able to see multilevel dashboard tabs. 



No comments:

Post a Comment