Rendering reports in iFrames
May 9, 2012 19 Comments
There may be times where you want to embed your Cognos reports in other applications. The easiest way to handle this is with an iFrame, using the GET method. This is when you paste all of the parameters into the URL. For example:
http://../cgi-bin/cognos.cgi?b_action=cognosViewer&ui.action=run&ui.object=%2fcontent%2ffolder%5b%40name%3d%27Cognos%20Launch%27%5d%2freport%5b%40name%3d%27Chart%27%5d&ui.name=Chart&run.outputFormat=&run.prompt=false&cv.toolbar=false&cv.header=false
That would call the report Charts inside the folder “Public Folders\Cognos Launch”, run it in HTML without prompting, hiding the header and toolbar. The iFrame would stretch horizontally and vertically to fill the page. It is possible to pass parameters to the iFrames. &p_Year=2005 would send the value “2005” to the parameter “Year”. Notice the p_ preceding the parameter name, if your parameter is p_Year, the URL parameter would then be p_p_Year.
This image shows a report consisting of a single graph sitting inside an iframe inside another report consisting solely of two prompts. When a prompt value is selected, the prompt page refreshes instantly, while the child report may slightly longer to run. It is possible to stack many report objects in a single prompt page with this, allowing the prompt page to run instantly, while the sub reports take longer to run.
The Year HTML item is a report expression with '&p_Year='+ParamValue('Year'). If the year parameter is empty, the Year HTML item won’t render. It is important to pass optional parameters in separate HTML items for this reason.
Now to complicate matters a bit, suppose there is a requirement to update the iFrame without refreshing the outer page. Another requirement is to stop using the GET method (in which parameters are taken from the URL) and to use POST. There are many reasons why POST is preferable to GET, but I’m not going into them now. Instead, let’s talk about the cognosLaunchInWindow method. The basic idea is the same, but we’re not passing the URL directly to the iFrame. We still need to pass all of the same parameters. Look at the following code:
function runReport()
{
cognosLaunchInWindow
(
'Report', "toolbar=no"
, 'ui.gateway' , cognosURL
, 'ui.tool' , 'CognosViewer'
, 'ui.action' , 'run'
, 'ui.object' , "/content/folder[@name='Cognos Launch']/report[@name='Chart']"
, "run.prompt" ,"false"
, "ui.toolbar" ,"false"
, "ui.header" ,"false"
, "cv.toolbar" ,"false"
, "cv.header" ,"false"
, "p_Year" , iYear
, "p_ProductLineCode", iProductLineCode
)
}
When this function is run, Cognos will attempt to run the report Chart under the folder Cognos Launch in the window or frame named “Report”. It will not prompt, but attempt to populate the prompts with the global JS variables iYear and iProductLineCode. The full script I used for this is:
<script language="JavaScript" src="../cognoslaunch.js"></script>
<script language="javascript">
var fW = (typeof getFormWarpRequest == "function" ? getFormWarpRequest() : document.forms["formWarpRequest"]);
if ( !fW || fW == undefined)
{ fW = ( formWarpRequest_THIS_ ? formWarpRequest_THIS_ : formWarpRequest_NS_ );}
var cognosURL = window.location.pathname;
var iYear = '';
var iProductLineCode = '';
var YearList = fW._oLstChoices_Year;
var ProductLineList = fW._oLstChoices_ProductLine;
function runReport()
{
cognosLaunchInWindow
(
'Report', "toolbar=no"
, 'ui.gateway' , cognosURL
, 'ui.tool' , 'CognosViewer'
, 'ui.action' , 'run'
, 'ui.object' , "/content/folder[@name='Cognos Launch']/report[@name='Chart']"
, "run.prompt" ,"false"
, "ui.toolbar" ,"false"
, "ui.header" ,"false"
, "cv.toolbar" ,"false"
, "cv.header" ,"false"
, "p_Year" , iYear
, "p_ProductLineCode", iProductLineCode
)
}
YearList.onchange = new Function("iYear=YearList.value;runReport();");
ProductLineList.onchange = new Function("iProductLineCode=ProductLineList.value;runReport();");
</script>
Once a value is selected from either prompt, it will populate the associated JS variable with the value, and run the report. This allows for dashboards that do not be refreshed. Additionally, you could stick the function into another application to programmatically call Cognos reports. Just make sure of your license agreement before you start doing it on a widespread basis.
Both the iFrame source method, and the CognosLaunch method work with URL parameters. You can learn more about URL parameters through the admin and security guide, or by reading .
The XML for the frame report:
<report xmlns="http://developer.cognos.com/schemas/report/8.0/" useStyleVersion="10" expressionLocale="en-us">
<modelPath>/content/folder[@name='Samples']/folder[@name='Models']/package[@name='GO Sales (query)']/model[@name='model']</modelPath>
<drillBehavior modelBasedDrillThru="true"/>
<layouts>
<layout>
<reportPages>
<page name="Page1">
<style>
<defaultStyles>
<defaultStyle refStyle="pg"/>
</defaultStyles>
</style>
<pageBody>
<style>
<defaultStyles>
<defaultStyle refStyle="pb"/>
</defaultStyles>
</style>
<contents><table><style><defaultStyles><defaultStyle refStyle="tb"/></defaultStyles><CSS value="border-collapse:collapse;width:100%;height:100%"/></style><tableRows><tableRow><tableCells><tableCell><contents><selectValue parameter="Year" refQuery="Years" required="false" name="_Year"><useItem refDataItem="Year"/></selectValue><selectValue parameter="ProductLineCode" refQuery="ProductLineCode" required="false" name="_ProductLine"><useItem refDataItem="Product line code"><displayItem refDataItem="Product line"/></useItem></selectValue><HTMLItem>
<dataSource>
<staticValue><script language="JavaScript" src="../cognoslaunch.js"></script>
<script language="javascript">
var fW = (typeof getFormWarpRequest == "function" ? getFormWarpRequest() : document.forms["formWarpRequest"]);
if ( !fW || fW == undefined)
{ fW = ( formWarpRequest_THIS_ ? formWarpRequest_THIS_ : formWarpRequest_NS_ );}
var cognosURL = window.location.pathname;
var iYear = '';
var iProductLineCode = '';
var YearList = fW._oLstChoices_Year;
var ProductLineList = fW._oLstChoices_ProductLine;
function runReport()
{
cognosLaunchInWindow
(
'Report', "toolbar=no"
, 'ui.gateway' , cognosURL
, 'ui.tool' , 'CognosViewer'
, 'ui.action' , 'run'
, 'ui.object' , "/content/folder[@name='Cognos Launch']/report[@name='Chart']"
, "run.prompt" ,"false"
, "ui.toolbar" ,"false"
, "ui.header" ,"false"
, "cv.toolbar" ,"false"
, "cv.header" ,"false"
, "p_Year" , iYear
, "p_ProductLineCode", iProductLineCode
)
}
YearList.onchange = new Function("iYear=YearList.value;runReport();");
ProductLineList.onchange = new Function("iProductLineCode=ProductLineList.value;runReport();");
</script></staticValue>
</dataSource>
</HTMLItem></contents></tableCell></tableCells></tableRow><tableRow><tableCells><tableCell colSpan="1"><contents><HTMLItem description="iFrame_Report">
<dataSource>
<staticValue><iframe
id='Report'
name='Report'
src=''
width=100%
height=100%
>
</iframe>
<script> runReport();</script></staticValue>
</dataSource>
</HTMLItem></contents><style><CSS value="height:100%;vertical-align:top;text-align:center"/></style></tableCell></tableCells></tableRow></tableRows></table></contents>
</pageBody>
</page>
</reportPages>
</layout>
</layouts>
<XMLAttributes><XMLAttribute name="RS_CreateExtendedDataItems" value="false" output="no"/><XMLAttribute name="listSeparator" value="," output="no"/><XMLAttribute name="RS_modelModificationTime" value="2011-06-09T13:52:15.420Z" output="no"/></XMLAttributes><queries><query name="Years"><source><model/></source><selection><dataItem name="Year" aggregate="none"><expression>[Sales (query)].[Time].[Year]</expression></dataItem></selection></query><query name="ProductLineCode"><source><model/></source><selection><dataItem name="Product line code" aggregate="none"><expression>[Sales (query)].[Products].[Product line code]</expression></dataItem><dataItem name="Product line" aggregate="none" sort="ascending"><expression>[Sales (query)].[Products].[Product line]</expression></dataItem></selection></query></queries><reportName>PromptsCognosLaunch</reportName></report>
And the XML for the chart report, just remember to save it under root\Cognos Launch\Chart, or to change the path in the function.
<report xmlns="http://developer.cognos.com/schemas/report/8.0/" useStyleVersion="10" expressionLocale="en-us"> <modelPath>/content/folder[@name='Samples']/folder[@name='Models']/package[@name='GO Sales (query)']/model[@name='model']</modelPath> <drillBehavior modelBasedDrillThru="true"/> <queries> <query name="Query1"> <source> <model/> </source> <selection><dataItem name="Month" aggregate="none" rollupAggregate="none"><expression>[Sales (query)].[Time].[Month]</expression><XMLAttributes><XMLAttribute name="RS_dataType" value="3" output="no"/><XMLAttribute name="RS_dataUsage" value="attribute" output="no"/></XMLAttributes></dataItem><dataItem name="Quantity" aggregate="total"><expression>[Sales (query)].[Sales].[Quantity]</expression><XMLAttributes><XMLAttribute name="RS_dataType" value="1" output="no"/><XMLAttribute name="RS_dataUsage" value="fact" output="no"/></XMLAttributes></dataItem><dataItem name="Year" aggregate="none" rollupAggregate="none"><expression>[Sales (query)].[Time].[Year]</expression><XMLAttributes><XMLAttribute name="RS_dataType" value="1" output="no"/><XMLAttribute name="RS_dataUsage" value="attribute" output="no"/></XMLAttributes></dataItem><dataItem name="Month (numeric)" aggregate="none" rollupAggregate="none"><expression>[Sales (query)].[Time].[Month (numeric)]</expression><XMLAttributes><XMLAttribute name="RS_dataType" value="1" output="no"/><XMLAttribute name="RS_dataUsage" value="attribute" output="no"/></XMLAttributes></dataItem></selection> <detailFilters><detailFilter use="optional"><filterExpression>[Sales (query)].[Time].[Year]=?Year?</filterExpression></detailFilter><detailFilter use="optional"><filterExpression>[Sales (query)].[Products].[Product line code]=?ProductLineCode?</filterExpression></detailFilter></detailFilters></query> </queries> <layouts> <layout> <reportPages> <page name="Page1"><style><defaultStyles><defaultStyle refStyle="pg"/></defaultStyles></style> <pageBody><style><defaultStyles><defaultStyle refStyle="pb"/></defaultStyles></style> <contents> <combinationChart showTooltips="true" maxHotspots="10000" refQuery="Query1" name="Combination Chart1"> <legend> <legendPosition> <relativePosition/> </legendPosition> <legendTitle refQuery="Query1"> <style> <defaultStyles> <defaultStyle refStyle="lx"/> </defaultStyles> </style> </legendTitle> <style> <defaultStyles> <defaultStyle refStyle="lg"/> </defaultStyles> </style> </legend> <ordinalAxis> <axisTitle refQuery="Query1"> <style> <defaultStyles> <defaultStyle refStyle="at"/> </defaultStyles> </style> </axisTitle> <axisLine color="black"/> <style> <defaultStyles> <defaultStyle refStyle="al"/> </defaultStyles> </style> </ordinalAxis> <numericalAxisY1> <axisTitle refQuery="Query1"> <style> <defaultStyles> <defaultStyle refStyle="at"/> </defaultStyles> </style> </axisTitle> <gridlines color="#cccccc"/> <axisLine color="black"/> <style> <defaultStyles> <defaultStyle refStyle="al"/> </defaultStyles> </style> </numericalAxisY1> <combinationChartTypes> <bar/> </combinationChartTypes> <style> <defaultStyles> <defaultStyle refStyle="ch"/> </defaultStyles> </style> <commonClusters><chartNodes><chartNode><chartNodeMembers><chartNodeMember refDataItem="Year"><chartContents><chartTextItem><dataSource><memberCaption/></dataSource></chartTextItem></chartContents></chartNodeMember></chartNodeMembers><chartNestedNodes><chartNode><chartNodeMembers><chartNodeMember refDataItem="Month"><chartContents><chartTextItem><dataSource><memberCaption/></dataSource></chartTextItem></chartContents><sortList><sortItem refDataItem="Month (numeric)"/></sortList></chartNodeMember></chartNodeMembers></chartNode></chartNestedNodes></chartNode></chartNodes></commonClusters><defaultChartMeasure refDataItem="Quantity"/></combinationChart> </contents> </pageBody> </page> </reportPages> </layout> </layouts> <XMLAttributes><XMLAttribute name="RS_CreateExtendedDataItems" value="false" output="no"/><XMLAttribute name="listSeparator" value="," output="no"/><XMLAttribute name="RS_modelModificationTime" value="2011-06-09T13:52:15.420Z" output="no"/></XMLAttributes><reportName>Chart</reportName></report>
Paul's Cognos Blog 
Hi Paul,
First, Thank you. Second – where can I find out more about the POST method? I can’t really find anything about it.
There’s a good explanation here. I think one of the most important things that I forgot to mention is that variables appended to the URL need to be URL encoded, or you may get unexpected results. Not so with the POST.
Hi Paul,
I am new to Cognos. We are trying to get our application to render Cognos 10 reports in iFrame. We have just recently upgraded from Cognos 8 to Cognos 10.
Our application uses an identity management service called eAuthentication (eAuth). The idea is to have one login for every application. Users can sign up online or see a local registration officer depending on the eAuth level they need.
eAuth uses a Computer Associates (CA) product called Siteminder to protect applications. You install siteminder on your public facing webserver and when someone goes to the URL they are redirected to a eAuth login page. Once the user logs in they are allowed to proceed to the site.
We had problems getting eAuth to work with Cognos. The way siteminder was configured at the OCIO wouldn’t allow Cognos to communicate with the server. We ended up having to take the “Siteminder light” approach.
Basically, we store the users eAuth internal ID number in Oracle Directory Services(ODS). The user will go to our URL, sign in to eAuth, and Cognos will check to see if they are in the ODS. If they in the directory they are let in. If they are not in the directory Cognos will prompt them for a UserID and Password.
The problem we are having is that eAuth is blocking the application from rendering the reports in iFrame. Here is the description of the error:
“The system has encountered an error.
The URL you were trying to access contains embedded HTML tags. The eAuthentication system does not allow authentication from URL’s that contain characters known to be used in cross site scripting attacks. These characters were most likely generated by the application you were trying to access. Please open a new browser window and log into the application you were trying to access again.”
Any suggestions/comments/recommendations would be greatly appreciated.
Thank you.
Hi Rod,
How are you with JavaScript? If you can’t embed iframes into your application, you may have to use CMS to retrieve report elements and put them directly into the page. While more complex and difficult to build, it may ultimately a preferable solution as the report elements appear directly in the page, and you can interact directly with them with JS.
I’ve built a few applications like this, the question is if I have an easily accessible example.
Paul, thanks for the response. I’ve written JavaScript applications before, but not as complex as your suggestion appears to be. If you could provide me some examples on how to accomplish this, that would be very helpful.
Hey Paul,
Great blog with tons of good info here – thank you very much for sharing.
Do you know if it is possible to run a report and have it emailed all as part of a url call or script?
Hi Sue,
Emailing a report via a URL is something I’ve longed for, for a long time. There are two possibilities. If the report is on the page, you can use the “send report” button (or the JavaScript behind that button) to open the send email screen. Alternatively, you can set up a job to send the mail and trigger the job with a script. Look up triggers for more details on that.
Good luck
Hello
we can did the smiliar concept in our last assignment, but we find , when we have multiple iframes in same report page, we can’t see iframe outputs in pdf or excel, it’s only working in html option for priting.
Hi,
we are using the iframe to design the dashboard with multiple reports (tagged as iframe). The issue is, the charts inside the iframe is coming up with the scroll bars. In the iframe definition, the scrollbar option is set to no. But stil the chart is coming with the scross bars. How to avoid this.
please help.
Remember to set the height and width of the iframes, by default they’re somewhat small.
Use Mozilla and Firebug to troubleshoot where the scrollbars are coming from. Cognos plays many tricks with the report DOM so sometimes it’s not easy.
You’ll need to set the height and width of the report objects (using the properties box) for page, page body, and any containing blocks. You’ll also want to set all of them to “Content is clipped”.
Also –
In a html item you want to put some css in to:
Set height and width of html, body
Remove padding or margins for body and .pb
AND this one line in css to remove scrollbars in reports viewed in nearly every browser but FireFox.
.RVContent {overflow:hidden}
I think the last line fixes a cognos bug
It’s possible to use multiple nested blocks to control scroll bars. The outer block should be sized in pixels and set to “Clip”, then the inner block should be sized to the same pixels or set to 100% height and width but set to “use scroll bars only when necessary”.
to see a beta example of how we’ve integrated reports into a dashboard go to (firefox is best but we’re trying to make it work right in all browsers – turn on popups to enable functionality on the dashboard [we’re working to not require popups]):
http://50.19.229.134:8095/wisdom/index.html?topicId=421&topicName=Heart%20attacks&type=normal
You can use firebug to see the html/css we used.
Hi Paul,
Do you know if there is a way to add additional filter “that comes” from the crosstab:
When I click on some in the crosstab it’s automatically pass the values of the row and column Values (like in Drill through)
I’m trying to show/Open the Drill through in the Iframe…
cognosLaunchInWindow
(
‘Report’, “toolbar=no”
, ‘ui.gateway’ , cognosURL
, ‘ui.tool’ , ‘CognosViewer’
, ‘ui.action’ , ‘run’
, ‘ui.object’ , irep
, “run.prompt” ,”false”
, “ui.toolbar” ,”false”
, “ui.header” ,”false”
, “cv.toolbar” ,”false”
, “cv.header” ,”false”
, “p_p_contract” , iContract
, “p_p_CrossTab_ROW” , CrossTabROW
, “p_p_CrossTab_Column” , CrossTabColuman
)
Thanks,
Sasha
A bit late in seeing this, set the HTML item to report expression:
If you need to use an item that’s not referenced in the layout, like using the code instead of the caption, remember to add that item to the properties of the xtab node.
Careful about security with this method. Might want to encapsulate the value in the report.
Hi Paul,
i’ve used iframes to render serveral diffrent reports in one page and it works fine. Then I created a button to run one of the reports in PDF-output, also workes fine. Now i want to force a the report server to create a PDF in the filesystem (CM.OUTPUTLOCATION is activated) and i wanted to do so in simply creating a button that starts the runWithOptions button in the cognos connection. but the cognosLaunch() function does always want some more Spezifications. Have you tried something similar once before, or would you resolve this in another way?
Cheers Hubert
Hi Paul, what does the “start” and “end” HTML items contain?
The start contains the start of the iFrame tag:
<iframe
src="../cgi-bin/cognos.cgi?b_action=cognosViewer&ui.action=run&ui.object=%2fcontent%2ffolder%5b%40name%3d%27Cognos%20Launch%27%5d%2freport%5b%40name%3d%27Chart%27%5d&ui.name=Chart&run.outputFormat=&run.prompt=false&cv.toolbar=false&cv.header=false
and the end closes it
"
width=100%
height=100%
>
Hi Paul, can you please let me know the code for a multiselect prompt values, I am not able to get that.
Regards,Naresh
Mutliselect prompts are difficult in 10.1 and below. Starting in 10.2 you can simply retrieve the selected value in a JSON string and simply pass that.
There are two ways of handling a multiselect prompt here. One, if you have the prompt on the page you can write a JS function to loop through the prompt and pass the additional options. Each additional option should have the parameter name, so it would look like:
,”p_year”,”2011″
,”p_year”,”2012″
An alternative is to simply pass all of the values in the same parameter and modify the target report to expect that:
,”p_year”,”2011,2012″