Sunday, December 9, 2012

Using Jasper Report In ADF Application (Step-by-Step)

In my previous post I explain how to use Jasper Report but because of many people send me many requests for explain this topic in more detail so I will explain it in step by step.

our example will make application with one screen this screen has a table of employees you should select an employee and send the selected employee id to jasper report to print the selected employee data.

Before we begin be sure of:

1- You download iReport-4.0.1 (you can get it from I download iReport-4.0.1-windows-installer.exe.

2- You have database has hr schema.

3- Setup JDeveloper 11g (any release).

Now we can begin ......

Step 1:

Setup iReport-4.0.1
Step 2:
Open JDeveloper and make new ADF Application (name it for example JasperApplication)

Step 3:

Connect your application to your database HR Schema by right click in your Model application ---> new ---> ADF Business Components ---> Business Components From Table
Add your connection and test the connection

Add one Entity Objects (Employees)
Add one Updatable View Objects
Then press finish, your application should be like this
Step 4:
Create new jspx page (name it for example employees.jspx)
In your ViewController project right click on Web Content folder then new --->JSF ---> JSF Page

From the Data Controls drag EmployeesView1 to your page as an ADF Read-only Table

From Row Selection Select Single Row
Add a button above a table (text it for example Run Report) and its action point to a method in a back bean (for example Back bean name is

To get the selected employee id:
    DCIteratorBinding empIter = (DCIteratorBinding) getBindings().get("EmployeesView1Iterator");
    String empId = empIter.getCurrentRow().getAttribute("EmployeeId").toString();

where EmployeesView1Iterator is the iterator name in the page definition and EmployeeId is the attribute name in the EmployeesView.

now we should pass the selected employee Id to jasper report so, you should make a map and set the parameter like
    Map m = new HashMap();
    m.put("employeeId", empId);// employeeId is a jasper parameter name

then you should call the jasper report like this method
 runReport("empReport.jasper", m);

where runReport is the method take jasper report name (empReport.jasper) and the map which hold the parameter

write this code in your



After you write this code you will find Jasper library missing

to get jasper libraries goto the folder which you setup iReport for example in this path
C:\Program Files (x86)\Jaspersoft\iReport-4.0.1\ireport\modules\ext
and get these libraries:
1- iText-2.1.7.jar
2- jasperreports-4.0.1.jar
3- jasperreports-fonts-4.0.1.jar

add this libraries to your ViewController project ---> Right click on the project ---> Project Properties--->Libraries And Classpath ---> Add JAR/Directory

Now your code should have no error

Now my Back bean code is :

Now depending on my previous code we should make a report the name of this report should be "empReport" and has one parameter "employeeId"

Step 5:

Open iReport and make a connection to hr database but first ..... iReport has not oracle database driver so you use oracle database you should first add a ojdbc jar file to the classpath of iReport.

you can get ojdbc jar file in your middleware home like:
C:\Oracle\Middleware\wlserver_10.3\server\lib and search for ojdbc6.jar

In iReport goto Tools---> Options ---> Classpath and add ojdbc6.jar
Now make a new connection to hr schema
Now from File ---> New and make new Report
Choose any template or make it blank then press "Launch Report Wizard"

Write report name "empReport" and under your web content folder in ViewController project make new folder "reports" and save the report on this path

Press on Design query button and select your schema then drag Employees table
then press Ok you will find the report query will generated then press Next and shuttle the field you want to displayed in your report
Then press next then finish. You will find you report generated.
Goto the report query as shown:

and make new Parameter "employeeId"
add where clause to the query like:
WHERE EMPLOYEES."EMPLOYEE_ID"=to_number($P{employeeId})

Now you can preview your report by pressing on "Preview" button and enter for example employeeId = 200

Now compile your report to generate .jasper file in your application
If you goto your application you should something like this:
before you run be sure of two things:
1- any picture you use in jasper should be in the class path
2- You should define datasource in your weblogic "as we write in the code datasource is hrDS"

for how you can define data source in weblogic try this

Step 6:
run your application and select any employee then press on "Run Report" button
for example select employee Id= 104 then run report

you can download the application from this link JasperApplication

To open the report in new window:

1- In the .jspx right click on the af:document -->Facets - Document --> Meta Container 
2- Inside f:facet - metaContainer add af:resource with type="javascript" as:

inside af:resource you can add javascript function 

function newWindow()
  document.getElementById("f1").target = "_blank;targetfeatures=toolbar=no location=no directories=no menubar=no";

where "f1" is the af:form id.

So the structure will be:

To call this function add button or link and inside this link add clientLister as: