Or how to change this:
into :
First add an extra .TabDimCell to your portalcontent.css and call it .TabDimCell2:
Do the same for TabHiCell:
On each dashboard page add an extra text element and check the contains HTML box:
Add the following code to the text box
[code]
<script type="text/javascript">
function addSep(id){
var tbody = document.getElementById(id).getElementsByTagName("TBODY")[0];
var td1 = document.createElement("td");
var row = document.createElement("tr");
td1.className = 'TabSep';
td1.innerHTML =' ';
td1.id='tr2';
row.appendChild(td1);
tbody.appendChild(row);
}
function insCell(str,orgclassName)
{
var oTable = document.getElementById('TabsTable');
var lastRow = oTable.rows.length;
lastRow = lastRow -1
var mytable=document.getElementById('TabsTable')
var newcell=mytable.rows[lastRow].insertCell(-1) //insert new cell to end of 2nd row
newcell.innerHTML=str;
if (orgclassName == 'TabDimCell') {
newcell.className = 'TabDimCell2';
}
if (orgclassName == 'TabHiCell') {
newcell.className = 'TabHiCell2';
}
var newcell=mytable.rows[lastRow].insertCell(-1) //insert new cell to end of 2nd row
newcell.className = 'TabSep TabDimSep';
newcell.innerHTML =' ';
}
var tds = document.getElementsByTagName('td');
var TabCount = 0;
var lTAB = new Array();
for (var td = 0; td < tds.length; td++) {
if (tds[td].className != 'TabDimCell' && tds[td].className != 'TabHiCell' ) {
continue;
}
if (TabCount == 4) {
addSep('TabsTable');
}
if (TabCount >= 4) {
var str = tds[td].innerHTML;
var orgclassName = tds[td].className;
insCell(str,orgclassName);
tds[td].style.display = "NONE";
tds[td+1].style.display = "NONE";
}
TabCount = TabCount + 1;
}
</script>
[/code]
Ok i’m not a full time javascript programmer so if you have a better solution please let me know.
Till Next Time
15 comments:
Great bit of code. I have one question though.
When I select a tab on the second row, it does not inherit the TabHiCell formatting. Did you have the same issue?
@Raventh:
Thanks for noticing, I've changed the code, should work now.
regards
John
Thank you for such a quick reply! It works perfectly now.
John, wonderful piece of code. I would like to shift the first line of tabs to the right. Any thoughts.
Superb Code ... Helped a lot ..
Hi John .. I need sub pages for my dashboard .. As I have 17 pages in one dashboard and I want to group them . Any suggestion.
Please send me details at paragbhargava29@gmail.com
Thanks in Advance
Parag
John, have not been able to move the first line of tabs to the right. I need to have the first line of tabs offset by 1/2 a tab to the right. Any insights would be great.
btriplett2002@yahoo.com
@Anonymous/@Bren,
Why don't you add a "dummy" pic or cell add the start of line two? Make it the width of half a tab.
regards
@Parag,
Just navigate to "hidden" dashboards.
regards
John, so by adding a empty cell to the in front of the second line the first line will move 1/2 tab to the right?
Thanks
Bren
Bren,
Have a look here:
http://obiee101.blogspot.com/2010/06/obiee-multie-line-tabs-part-2.html
regards
John, your tab number 2 looks very cool. It seems that you really enjoy OBIEE.
Bren
Hi John,
Well the solution is working good ,but sometimes and it's true almost the time we have not acces to the server(in order to customize portalcontent.css ) .My question is how can we use this solution in this case?
Thx a lot and nice work
obiee.bi-online.fr
@OBIEE,
You can also add the CSS to a HTML block on your dashboard.
regards
John
Dear John, can you help me please? If I insert the javascript code in the text item - nothing happening. When I use your code from OBIEE multi-line tabs Part 2 - it make all tabs invisible
Best regards
Irina
Post a Comment