Rendering reports in iFrames

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 FoldersCognos 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>&lt;script language="JavaScript" src="../cognoslaunch.js"&gt;&lt;/script&gt;
&lt;script language="javascript"&gt;
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();");

&lt;/script&gt;</staticValue>
			</dataSource>
		</HTMLItem></contents></tableCell></tableCells></tableRow><tableRow><tableCells><tableCell colSpan="1"><contents><HTMLItem description="iFrame_Report">
			<dataSource>
				<staticValue>&lt;iframe
  id='Report'
  name='Report'
  src=''
  width=100%
  height=100%
&gt;
&lt;/iframe&gt;
&lt;script&gt; runReport();&lt;/script&gt;</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 rootCognos LaunchChart, 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>