The ActiveX Viewer Control allows you to view and print report output in a web browser.
This walkthrough is split up into the following activities:
- Adding an ActiveReport to an ASP.NET Web application
- Connecting the report to a data source
- Adding controls to the report to contain data
- Adding the ActiveX viewer .cab file to the project folder
- Adding a ReportOutput folder to the project folder
- Adding required Object tags to the html code for the Web Form
- Adding code for the window_onload event for the Web Form
- Adding code to the Web Form's Page_Load event
To complete the walkthrough, you must have access to the Northwind database.
A copy is located at C:\Program Files\Data Dynamics\ActiveReports for .NET 3.0\Data\NWIND.MDB.
You must also have access to Internet Information Services either from your computer or from the server. You must also run the "Configure Web Sample" option from the Data Dynamics ActiveReports for .NET 3.0 program menu from your Windows Start button.
When you have completed this walkthrough, you will have a report that looks similar to the following.
Adding an ActiveReport to an ASP.NET Web application
To add an ActiveReport to your project using Visual Studio 2003
- Create a new ASP.NET Web application.
- From the Project menu, select Add New Item.
- Select ActiveReports 3.0 File and rename the file rptActiveX.
- Click Open.
To add an ActiveReport to your project using Visual Studio 2005
- Create a new ASP.NET Web site.
- From the Website menu, select Add New Item.
- Select ActiveReports 3.0 File and rename the file rptActiveX.
- Click Add.
- Click Yes when a message box asks whether you would like to place the class in the 'App_Code' folder.
Connecting the report to a data source
To connect the report to a data source
- Click on the gray report DataSource icon in the Detail section to open the report DataSource dialog.
- Click on Build.
- Select Microsoft Jet 4.0 OLE DB Provider and click Next.
- Click the ellipsis button to browse for the access path to the NorthWind database. Click Open once you have selected the appropriate access path.
- Click OK to continue.
- In the Query field, type "Select * from products order by categoryID".
- Click OK to return to the report design surface.
Adding controls to the report to contain data
To add controls to the report
- Add a GroupHeader/Footer section to rptActiveX by right-clicking the design surface of the report and selecting Insert > Group Header/Footer.
- Make the following changes to the group header:
- Change the Name property to ghCategories
- Change the BackColor property to RosyBrown
- Change the DataField property to CategoryID
- Add labels with the following properties to ghCategories:
Name Text Location lblProductName Product Name 0, 0 lblUnitsInStock Units In Stock 1.88, 0 lblUnitsOnOrder Units On Order 2.94, 0 lblUnitPrice Unit Price 4, 0 - Set the CanShrink property of the detail section to True.
- In the Report Explorer, expand the Fields node, then the Bound node. Drag the following fields onto the detail section and set the following properties of each textbox as indicated.
Field Text Location Output Format ProductName Product Name 0, 0 NA UnitsInStock Units In Stock 1.88, 0 NA UnitsOnOrder Units On Order 2.94, 0 NA UnitPrice Unit Price 4, 0 Currency
Adding the ActiveX .cab file to the project folder
To add the ActiveX .cab file
- Open Windows Explorer and browse to the folder in which ActiveReports for .NET 3.0 is installed. The default location is "C:\Program Files\Data Dynamics\ActiveReports for .NET 3.0."
- Double-click the Deployment folder. Copy the file called "arview2.cab" by right-clicking on the file and selecting Copy.
- Browse to the folder in which your project is contained.
- Paste the .cab file into your project's folder.
Adding a ReportOutput folder to the project folder
To add a folder to the project
- Open Windows Explorer and browse to the folder in which your project is contained.
- On the File menu, click New> Folder.
- Name the folder "ReportOutput".
- Make sure that you have write permissions for this folder.
Adding Object tags to the Web Form's HTML code
To add Object tags to the Web Form
- In the body of the HTML view of the Web Form, but outside the <form> tags, add the following code.
<OBJECT id="arv" codeBase="arview2.cab" height="100%" width="100%" classid="clsid:8569D715-FF88-44BA-8D1D-AD3E59543DDE" VIEWASTEXT> <PARAM NAME="_ExtentX" VALUE="11218"> <PARAM NAME="_ExtentY" VALUE="7329"></OBJECT>
Adding code to the Web Form's window_onload event
To add code to the window_onload event
- At the top of the HTML view of the Web Form, click on the drop-down arrow for "Client Objects and Events" and select "window".
- Click the drop-down arrow for the available events to the right of "window" and select "onload."
- This creates an event-handling method for the Web Form's window_onload event.
- Add the following code to the window_onload event.
arv.datapath = "ReportOutput/axreport.rdf";
Adding code to the Web Form's Page_Load event
To write the code in Visual Basic or C#
- Return to the Design view of the Web Form and double-click on the form. This creates an event-handling method for the Web Form's Page_Load event. Add the following code to the Page_Load event.
The following example shows what the code for the method looks like.
'Visual Basic
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles _ MyBase.Load
Dim rpt As New rptActiveX()
rpt.Run()
rpt.Document.Save(Server.MapPath("") + "\ReportOutput\axreport.rdf", DataDynamics.ActiveReports.Document.RdfFormat.AR20)
End Sub
//C#
private void Page_Load(object sender, System.EventArgs e)
{
rptActiveX rpt = new rptActiveX();
rpt.Run();
rpt.Document.Save(Server.MapPath("") + "\\ReportOutput\\axreport.rdf", DataDynamics.ActiveReports.Document.RdfFormat.AR20);
}