“How corrupting boredom is, everyone recognizes also with regard to children. As long as children are having a good time, they are always good. This can be said in the strictest sense, for if they at times become unmanageable even while playing, it is really because they are beginning to be bored[…]Adam was bored alone; then Adam and Eve were bored en famille. After that, the population of the world increased and the nations were bored en masse. To amuse themselves, they hit upon the notion of building a tower so high that it would reach the sky. This notion is just as boring as the tower was high and is a terrible demonstration of how boredom had gained the upper hand. Then they were dispersed around the world, just as people now travel abroad, but they continued to be bored” (S. Keirkegaard, the Rotation of Crops).
I like writing nifty solutions for Cognos, which look good, work well, and add a necessary functionality. Tabs for Cognos reports (Not Active Reports, where tabs exist out of box) are a great demonstration for such functionality: It’s a necessary functionality, and when done properly, they make a report look wonderful.
However, I get bored doing the same thing over and over. When writing a tabbing solution, the principal is always the same: There are the tabs themselves, which are essentially links to be clicked on, and when clicked, there are the contents which need to be either hidden or shown based on the tab that was clicked.
Every now and again a developer who may not be very well versed in HTML, JavaScript and/or CSS would ask me to add, remove or change a tab, or change the style of a tabbed menu, or any such thing. To me, this is boring, and as Kierkegaard noted, boredom is corrupting – indeed, it is the root of all evil.
What needed to be done, then, was to come up with a tabbing solution that allows developers to add, remove and edit tab contents and tab styles without needing to write a single letter of code. The scripted solution needed to be generalized so that developers would be able to use Cognos built-in features to control all aspects of tabs. In other words, I needed to write a tabbing solution that would be a piece of cake to maintain, leaving me with more free time to get bored productively in Cognoise forums.
POCT (=Piece of Cake Tabs) is just that solution. It requires no coding to add, remove, or edit the content a tab. It allows the user to style the tabs using nothing but Cognos built in features. Basically, once you set the solution up, you never have to open an HTML item again.
Let’s look at the page structure:
Under “Tab Headers” HTML Item, one would simply drop in text items one after the other, each containing the name of the tab (The text that would be written in the tab).
Under “Tab Content” HTML Item, one would create a block for each tab, and drop in the necessary objects for each tab. The uppermost block is the content for the leftmost tab header, and so on – tab headers from left to right, content blocks from top to bottom.
Under “Style” HTML Item there are 3 table cells. One can style them as one wish. The leftmost cell represents how a selected tab would look. The middle one represents the styling of a tab which isn’t currently selected. The rightmost cell controls how a tab looks on mouse over. You can also control the look of the entire tab row, by highlighting the blue table cell where the tab headers are and changing its design to modify the design of the tab row.
And that’s it.
Want to add a tab? Add a text item and a block accordingly. Want to change the content of a tab? Just change the content of a block. Want to remove a tab? Remove the header text item and the corresponding block. And styling is truly piece of cake.
Report XML (10.1) – you can either use that as base or copy the main block and anything in it to any report. This was tested on all Cognos 10.x versions, and should work fine on 8.4.x.
POCT-XML-101.txt (5569 downloads)Nimrod (Rod) Avissar is a BI Front-End Specialist, with a penchant for specialized UX solutions (LinkedIn).
Works great!
I liked your script. Thanks for posting it.
I am facing a problem after I put a search n select prompt in one of the tab, whenever user searches for a value it automatically goes to first tab once the search is complete.
Please forgive me if this is a very obvious question, but I’ll ask it anyway. I’ve copied the XML and pointed it at a package, and it all works as you would expect. How do I identify which tab has been clicked so that I can set up some render variables to show / hide the relevant data in the report? I’m a complete newbie when it comes to javascript, although I can just about read it…don’t know if that’s pertinent or not.
You don’t need to set up variables. The tabs work automatically via JS. The leftmost text item (Tab header) will hide everything but the content of the topmost block. The second from left text item (Tab header) will hide everything but the block that’s second from the top. And so on from left to right in tab headers, from top to bottom in blocks.
I have 4 reports and if I just copy the main block into each report then how do i get it on a dashboard to look like a multitab using the viewer? thanks
I’m not sure I follow the question. The solution is meant to be used to create a tabbed report in a single report, not to link between different reports.
Do you have a method of modifying excel tabs – which cognos (RS 10.2) currently
names Page1_1, Page1_2, Page1_3, etc. when page breaking the excel
report. The customer would like to see the page break info on the tabs….ex.
separate pages for each state, Tabs=Mo, IL, Ok, etc.
Thanks
I downloaded the text file that you attached on this blog. But I can’t open it in report studio. I can’t use your template and I can’t see the JS code you applied. Is there a way I could use or see it?Thanks in advance.
What you want to do is to copy the text in the text file, and then in Report Studio go t tools->Open report from clipboard. That’ll do the trick.
I placed in a single report but is there something i need to change to have the report show the content it only displays the tabs.
thanks
Hello, I placed my list report in the content of a block of 1 tab line and when i run it displays the tab headers and content lists, it does not display buttons until i hit bottom of report then it works like it should any suggestions. I am on version 10.1 thanks
Hi Mary,
Make sure the report doesn’t paginate. Everything must be displayed on the same page, no “Next Page” or “Bottom Page” links.
Hi Nimrod
I did remove the pagnite off the list and it did not work. I looked all through the report and can’t find what is making it not work
Thanks
Could you send me your report specs, so that I could have a look? Just go to tools->copy report to clipboard, then paste the result in notepad, save the file and send it my way (navissar@gmail.com).
Nimrod, Thank you I finally did manage to get it working there was a pagination that was still on in page setup.
Has anyone tried to used this with your animated cascading prompts? my manager wants to be able to use both together. I am not sure how to modify the script to accomodate both.
great work!
Hi >>>>>>>Nimrod (Rhod) Avissar
I already send you an email about the pagination problem which mess up all html function looking for your response.
Is there a limit to the number of report objects that can appear on the page? I have 4 tabs working perfectly, but when I start to add objects to the 5th tab the tabs break. I have checked every table/list/crosstab and the page to fix the pagination properties to not allow object to break pages, but it still does not seem to work.
I just wanna ask something regarding this Tabbed Report.
I actually did what is asked to do so i got the same output as the screenshot given.
My problem is, when i put a prompt and a chart on let me say Tab3, then as i run it, i select the Tab3 to view whats in the the said tab.
Then i select a value from the prompt. The prompt refresh the report, yes thats right. The problem is it refresh the whole page(report)
and so it will always go back to Tab1. Same thing happened when i used chart with Drill-down behavior.
Your knowledge would be really helpful so im looking forward for your response.
I have the same issue as ‘Ace’, if you have a graph or crosstab with drill-down functionality in each of the tabs (let’s say there’s 4 tabs in total), and you drill-down in Tab 3, the function appears to rerun and reset your tab view back to the first tab every time.
Any ideas on how to prevent defaulting back to the first tab when drill-down is initiated?
Hi Nimrod, I love this solution! It works great. Is there a way to use conditional blocks so that objects don’t run until that tab is selected? Large reports take a while to render.
Thank you very much. This post resolved my tab issue only 80%.
I need much more help.
I have a value prompt with HLRG data item. It contains multiple values more than 60. When I select few HLRG’s like 5 to 10 tab report working as expected but when I select more than 15 or ALL its not working. Please help me to resolve the issue ASAP. Its very urgent requirement to me.
Hi Paul, This looks really cool. was wondering if its possible to default the current selected tab after a cognos refresh. I do know its not straight forward as it needs a session holder. if I have two tabs and second tab has a submit button to refresh a list/chart the current solution gets back to first tab as its default. IS there a way to retain second tab as default or 3rd tab based on which page submit button was clicked. I think cognos should have a master container which can hold multiple pages as sub pages. It would have been good to take advantage of refreshing sub pages rather entire Master page. I also know I am talking Active reports in classic Report studio functions.
I have a dashboard and multiple blocks on the dashboard. Would I be able to have tabbed view with 2 tabs in each of the blocks?
This is an excellent help, i would like to extend it further by adding a little Jquery Fade In code snippet. like when ever you click a Tab Headers, Tab Content should fadi in, that will give it some extra cool feature,
can you adjust follow code to the JS function.
//
box 1
box 2
This is an excellent help, i would like to extend it further by adding a little Jquery Fade In code snippet. like when ever you click a Tab Headers, Tab Content should fadi in, that will give it some extra cool feature,
can you adjust follow code to the JS function.
”
//
”
“box 1”
“box 2”
Same issue as Ace, the tabs work ok however when you have multiple tabs with drill-down functionality in each, when drill-down is initiated the report always defaults back to the first tab.
Any solution to prevent this from happening?
Farhan – I strongly advise against integrating jQuery in Report Studio. Experience shows this to be a bad idea.
Steve, your requirement can be achieved. In order to do that we’ll need to define a dynamic default tab (effectively changing with every tab header click). The easiest way to do it is to put in a hidden text prompt, which gets written with the current tab’s ordinal. Then we can pull the right position from that.
I do not have the time currently to make such a solution generalised, but that should give you a good idea of how to proceed.
Hi! I inserted a List report in the 3rd tab together with a checkbox prompt that allows me to select which columns I want to show/hide. I also inserted a “Submit” button for the checkbox prompt but when I click on it, the report goes back to the first tab. Going back to the tab that contains the prompt and list, it was able to apply the columns I selected in the checkbox. I tried turning on the “Auto-Submit” property of the prompt and it is also doing the same thing. How can I pass the values selected in the checkbox and still make the report stay with the current tab? Thank you!
To get around the issue of going back to the first tab when drilling or other page refreshes, I saved the current tab id in the “clickTab” function using session storage, add a line like:
sessionStorage.setItem(“lastTab”,i); // keep the tab in memory in case of a page refresh, drill up/down, etc
Then, in the initialize section, read the saved value and set the selected tab accordingly:
var ti = sessionStorage.getItem(“lastTab”);
if (!ti) {ti = 0;}
The initialize section also needs to be modified, since it defaults to tab index value 0, so loop through all headers and content and turn on or off as in the clickTab function instead of starting at index 1.
Hi, Would it be possible to provide the code that you have implemented? I am trying to stay in the same tab and not go back to the first tab when users select a prompt and hit submit on the second tab. Thanks!
Hi Paul,
Can I you give one example to implement java script using custom control. Currently we are using Java scripts with out full interactivity in CA because of which we are loosing new features from CA 11.
It would be great if you post one article related to Custom contro.
Hi Raghuram, I’ve written a lot about it on the PMsquare blog. Take a look here: https://pmsquare.com/analytics-blog/tag/JavaScript