Tutorial 9: Implementing the JSAPI in a web page to display report parameters
This tutorial provides step-by-step instructions for authoring a web page to display a BIRT report with parameters in BIRT Viewer.
1 Using a code editor, open or create a JSAPITemplate.html file that contains the essential components for any web page that implements the JSAPI.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd" >
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>JSAPI Template</title>
</head>
<body onload="init( )" >
<div id="sample" >
<script type="text/javascript" language="JavaScript" src="http://127.0.0.1:8700/iportal/jsapi" ></script>
<script type="text/javascript" language="JavaScript" >
<!-- Insert code here -->
</script>
</div>
</body>
</html>
2 Navigate to the following line:
<title>JSAPI Template</title>
In title, change:
JSAPI Template
to:
Report Parameters Page
3 Navigate to the following line:
In id, change:
sample
to:
parameters
4 Navigate to the empty line after the following line:
<script type="text/javascript" language="JavaScript" >
5 Add the following code:
function init( ) {
actuate.load("viewer" );
actuate.load("parameter" );
actuate.initialize( "http://127.0.0.1:8700/iportal" , null , "administrator" , "" , displayParams);
}
function displayParams( ) {
param = new actuate.Parameter("parameters" );
param.setReportName("/Applications/BIRT Sample App /Customer Order History.rptdesign");
param.submit( function ( ) {document.getElementById("run" ).style.visibility = 'visible' ;});
}
function processParameters( ) {
param.downloadParameterValues(runReport);
}
</script>
</div>
<hr><br />
<input type="button" class="btn" name="run" id="run" value="Run Report" onclick="processParameters( )" style="visibility: hidden" >
<div id="viewer" >
<script type="text/javascript" language="JavaScript" src="http://127.0.0.1:8700/iportal/jsapi" ></script>
<script type="text/javascript" language="JavaScript" >
function runReport(paramvalues) {
var viewer = new actuate.Viewer("viewer" );
viewer.setReportName("/Applications/BIRT Sample App / Customer Order History.rptdesign");
viewer.setParameterValues(paramvalues);
viewer.submit( );
}
6 Save the file as parameterviewer.html.
7 In Internet Explorer, open parameterviewer.html.
If you receive a security warning that Internet Explorer has restricted this page from running scripts or ActiveX controls that could access your computer, right-click on the message and select Allow Blocked Content.
8 Choose Run Report to view the report.