Note: While some snippets of JavaScript and HTML are included in this KB article, a more comprehensive set of snippets and example IBM Cognos reports configured for Autosizing are included in the Autosizing Samples file. In addition full information on Autosizing can be found in the QueryVision Report AutoSizing Guide
QueryVision’s Autosizing capabilities require embedding references to JavaScript (.js) files and small snippets of JavaScript code into a Report Studio Report’s Specifications “using HTML Items” for interactively running the report as HTML in SharePoint. This can support:
- Fixed size – specify the height of the report in pixels
- Dynamic size – enable the report to resize to its actual height, along with a minimum and a maximum height
Configuring for Autosizing requires the following:
- Provide .js libraries on your Cognos Server – find the <installLocation>\ibm\cognos\c10_64\webcontent folder add a \queryvision sub folder and include the following files from the installed QueryVision\QueryVision SharePoint Web Parts\Configuration folder:
- iframeResizer.contentWindow.min.js
- qvtResizer.contentWindow.min.js
- Include JavaScript in an HTML item in your Report specification – As a quick demonstration select or create a Cognos Report Studio report with a single page definition – a simple list report best illustrates auto-sizing. In the report header (e.g. beside the Report Title) insert an “HTML item” and include the following:
Briefly: the ‘var QvtReportStyleProperties’ script specifies the Autosizing options and the other scripts load the necessary resizing JavaScript components.
Shown below is an example Cognos Report using Dynamic Autosizing using the IBM supplied sample Go Data Warehouse (analysis) Report Package and database. Note that it has a single report page definition. Also note where the HTML item is inserted in the report (in the Report header to ensure it is rendered on each page).
To embed this report in SharePoint requires using a QueryVision Report Viewer web part. To select the report and configure for Autosizing, do the following:
- First ensure you are logged into a Cognos Server on SharePoint via QueryVision Authentication to Cognos.
- Create or use an existing web part page, add a QueryVision Report Viewer to a web part zone, then select to “Edit web part”:
- Make the following changes:
- Set the Default Report Execution Mode to “HTML” and add either copy/paste a Cognos SearchPath to the Report Path property or click on the button beside the Report Path and navigate to and select the report.
Scroll down to the bottom of the the configuration settings and select OK or Apply, then OK to apply the settings. The report will now run with the Autosize settings.
If you had run the report without Autosizing (in which case the default 700px height would apply) you would see the following, which has a vertical scroll bar.
However, with Autosizing the report is presented as shown below. No vertical scroll bar, showing a full page of the report:
Setting height:100% is not an alternative – the following is what you get when ‘height:100%’ is included in the Report Style Properties string.
Why does this not work?
In general setting HTML height in percent is only effective on within the web page it is included. If the page is embedded in an iframe, particularly in the case (such as the SharePoint host page/Cognos iframe scenario) where the host page and iframe page are in different domains, then communication on height does not take place, so 100% loses its context.
