How to integrate Infragistics Reporting in WEB Applications

Infragistics offers the amazing NetAdvantage Reporting in the new 11.2 Release.  This is the perfect tool to create reports for XAML (Silverlight and WPF).In fact Infragistics Reporting is not only right solution for generating reports in XAML applications. It can be integrated very easily into WEB applications. 

In this article you will learn how to integrate reports created with NetAdvantage Reporting in ASP.Net applications. The demo application will show you how to integrate Silverlight client Report Viewer in an existing ASP.Net project. You will also learn how to generate server-side reports without Report Viewer using the Report Exporter. This approach can be used for integration into any WEB applications without any need for a Silverlight plug-in. Example application will demonstrate also how to pass parameters to the integrated Report in all  approaches.

What do you need to start:

We will discuss these steps in integrating Reporting

  • Create an Infragistics Report
  • Create a Silverlight application with a report viewer to visualize the reports
  • Server-side export reports using the report exporter.
  • Passing parameters for report generation


Demo application

For a basic application, to integrate Infragistics Reporting project will use ASP.Net, using WCF RIA Services.

Create in the Visual Studio 2010 new ASP.NET Web Application and give it a  name “IgReportingWebIntegration”.


Add to the WEB project ADO.NET Entity Data Model and name it “NorthwindModel”


Include in the model tables Customers, Categories and Products (in this article we will use only Customers).


Add in the project a  Domain Service Class and name it “DomainService1”

Modify the code in DomainService1.cs : add a new method GetCustomersByCountry  to be possible to filter customers by country.

   1: public IQueryable<Customer> GetCustomersByCountry(string country)

   2: {


   4:     if (country == null || country.Trim().Equals(string.Empty))

   5:     {

   6:         return GetCustomers(); 


   8:     }


  10:     return GetCustomers().Where(c => c.Country == country);


  12: }


Add a new Web Form, named “Customers” and create DomainDataSource and GridView instances  inside it. Below is a code in the .aspx file.

   1: <asp:Content runat="server" ID="Main" ContentPlaceHolderID="MainContent">

   2:     <cc1:DomainDataSource ID="DomainDataSource2" runat="server" 

   3:         DomainServiceTypeName="IgReportWebIntegration.DomainService1" 

   4:         QueryName="GetCustomersByCountry">

   5:         <QueryParameters>

   6:         <asp:ControlParameter Name="country" ControlID="tbCountry"

   7:              PropertyName="Text"  Type="String" />

   8:          </QueryParameters>

   9:     </cc1:DomainDataSource>

  10:     <p>

  11:         &nbsp;</p>


  13:     <table>

  14:     <tr>

  15:     <td>

  16:         Country:

  17:     </td>

  18:     <td>

  19:        <asp:TextBox ID="tbCountry"  runat="server" Width="240px" Text=""></asp:TextBox>

  20:     </td>

  21:     <td>

  22:         <asp:Button ID="Button2" runat="server" Text="FiIlter" Width="80px"  />

  23:     </td>

  24:     </tr>


  26:     <tr>

  27:     <td colspan=3>

  28:         <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 

  29:     DataKeyNames="CustomerID" DataMember="DefaultView" 

  30:     DataSourceID="DomainDataSource2" EditIndex="0" SelectedIndex="0">

  31:         <Columns>

  32:             <asp:BoundField DataField="CompanyName" HeaderText="CompanyName" 

  33:                 SortExpression="CompanyName" />

  34:             <asp:BoundField DataField="ContactName" HeaderText="ContactName" 

  35:                 SortExpression="ContactName" />

  36:             <asp:BoundField DataField="ContactTitle" HeaderText="ContactTitle" 

  37:                 SortExpression="ContactTitle" />

  38:             <asp:BoundField DataField="Address" HeaderText="Address" 

  39:                 SortExpression="Address" />

  40:             <asp:BoundField DataField="City" HeaderText="City" SortExpression="City" />

  41:             <asp:BoundField DataField="Country" HeaderText="Country" 

  42:                 SortExpression="Country" />

  43:             <asp:BoundField DataField="Phone" HeaderText="Phone" SortExpression="Phone" />

  44:         </Columns>

  45:     </asp:GridView>

  46:     </td>

  47:     </tr>

  48:     </table>


  50:     <asp:Button ID="Button1" runat="server" Text="Export" onclick="Button1Click"/>

  51: </asp:Content>


Run the demo application. Navigate to customers page and filter data to show only customers from Germany.



Create an Infragistics Report

Add two new Infragistics Report instances to the WEB project and name it NwReport ans NwReport2. NwReport will use data from WCF RIA Services and NwReport2 will use data directly from a database (SQL Server). The second report will use parameters in its query string.


Format the report to display customers.


Add a parameter, named “Country” in NwReport2. Default value is “%” to be possible to select all customers.


Modify the query string to use in the WHERE clause Country parameter.


   1: SELECT * FROM dbo.Customers where Customers.Country LIKE @Country


Create a Silverlight application with a report viewer to visualize the reports

Add a Silverlight application to the WEB solution.


In the WEB project are added two files IGReportingAppTestPage.aspx and IGReportingAppTestPage.html, that includes the Silverlight application. You can use either of these files


Add a XamReportViewer control in the Silverlight application.


Set RenderSettings property for the report viewer. Use NwReport.igr as a report and NwReportService.svc as a WEB service (one web service could work with many reports).

   1: <ig:XamReportViewer   Margin="20" Name="xamReportViewer1">

   2:     <ig:XamReportViewer.RenderSettings>

   3:         <ig:ServerRenderSettings DefinitionUri="/IgReportWebIntegration;component/NwReport.igr" ServiceEndpointUri="http://localhost:12931/NwReportService.svc" />

   4:     </ig:XamReportViewer.RenderSettings>

   5: </ig:XamReportViewer>


In the master page add a menu item to navigate to IGReportingAppTestPage.aspx

   1: <asp:MenuItem NavigateUrl="~/IGReportingAppTestPage.aspx" Text="Report" />


Run the application and navigate to the Silverlight application using “Report” option from the menu.


   1: <asp:MenuItem NavigateUrl="~/IGReportingAppTestPage.aspx" Text="Report" />


Server-side export reports using the report exporter

Add a new Web Form, named “CustomersReport” and add in the master page add a menu item to navigate to CustomersReport.aspx


   1: <asp:MenuItem NavigateUrl="~/CustomersReport.aspx" Text="Customers Report" />


Implement in CustomersReport.aspx.cs method Export()… where to use report exporter via ServerExporterFactory.CreateExporter(…) method. This method saves the generated report in PDF format.

Add method Export() in the Page_Load event handler.

   1: public partial class CustomersReport : System.Web.UI.Page

   2: {

   3:     #region Constructors

   4:     protected void Page_Load(object sender, EventArgs e)

   5:     {

   6:         Export();

   7:     }

   8:     #endregion //Constructors


  10:     #region Methods


  12:     #region Export

  13:     protected void Export()

  14:     {

  15:         var reportUri = new Uri("IgReportWebIntegration;component/NwReport.igr", UriKind.Relative);

  16:         using (var exporter = ServerExporterFactory.CreateExporter(reportUri))

  17:         {

  18:             var memoryStream = new MemoryStream();

  19:             exporter.Export(memoryStream, "PDF");

  20:             SendStreamToResponse(memoryStream, "Report1.pdf", "application/pdf");

  21:             memoryStream.Close();

  22:         }

  23:     }

  24:     #endregion //Export


  26:     #region SendStreamToResponse

  27:     private void SendStreamToResponse(MemoryStream stream, string fileName, string contentType)

  28:     {

  29:         var reportBuffer = stream.ToArray();

  30:         Response.AddHeader("Content-Length", reportBuffer.Length.ToString());

  31:         Response.ContentType = contentType;

  32:         Response.AddHeader("Expires", "0");

  33:         Response.AddHeader("Cache-Control", "must-revalidate, post-check=0, pre-check=0");

  34:         Response.AddHeader("Pragma", "public");

  35:         Response.AddHeader("Content-Disposition", "attachment; filename=" + fileName);

  36:         Response.BinaryWrite(reportBuffer);

  37:         Response.Flush();

  38:         Response.End();

  39:     }

  40:     #endregion //SendStreamToResponse


  42:     #endregion //Methods

  43: }

Run the application and select from its menu “Customers Report” option.


Application will export report in PDF format. This approach requires only server side references. You could use it in any WEB application where could use .NET Framework on the server.



Passing parameters for report generation

It is a very common case is when you use parameters to create the reports to filter data in the reports. We will use the same value, used to filter data from WCF RIA Services


Implement in Customers.aspx.cs file a method Export() used to export a report using a parameters.

The most important here is to add a parameter list to the report exporter.

   1: var reportUri = new Uri("IgReportWebIntegration;component/NwReport2.igr", UriKind.Relative);

   2:             using (var exporter = ServerExporterFactory.CreateExporter(reportUri))

   3:             {

   4:                 var memoryStream = new MemoryStream();



   7:                 // Set parameters in exporter

   8:                 var myquote = new Infragistics.Reports.ParameterValue();


  10:                 // Parameter Name used in the Report Design (.igr file)

  11:                 myquote.Name = "Country";


  13:                 // Parameter Value

  14:                 myquote.Value = tbCountry.Text;


  16:                 if (tbCountry.Text.Equals(String.Empty))

  17:                 {

  18:                     //Select all items if a parameter value is not set 

  19:                     myquote.Value = "%";

  20:                 }


  22:                 IEnumerable<ParameterValue> parameterList = new List<ParameterValue>() { myquote };


  24:                 exporter.Parameters = parameterList;


  26:                 exporter.Export(memoryStream, "PDF");

  27:                 SendStreamToResponse(memoryStream, "Report2.pdf", "application/pdf");

  28:                 memoryStream.Close();


The whole code of Customers.aspx.cs  is shown below.

   1: #region Methods


   3:  #region Export

   4:  protected void Export()

   5:  {

   6:      var reportUri = new Uri("IgReportWebIntegration;component/NwReport2.igr", UriKind.Relative);

   7:      using (var exporter = ServerExporterFactory.CreateExporter(reportUri))

   8:      {

   9:          var memoryStream = new MemoryStream();



  12:          // Set parameters in exporter

  13:          var myquote = new Infragistics.Reports.ParameterValue();


  15:          // Parameter Name used in the Report Design (.igr file)

  16:          myquote.Name = "Country";


  18:          // Parameter Value

  19:          myquote.Value = tbCountry.Text;


  21:          if (tbCountry.Text.Equals(String.Empty))

  22:          {

  23:              //Select all items if a parameter value is not set 

  24:              myquote.Value = "%";

  25:          }


  27:          IEnumerable<ParameterValue> parameterList = new List<ParameterValue>() { myquote };


  29:          exporter.Parameters = parameterList;


  31:          exporter.Export(memoryStream, "PDF");

  32:          SendStreamToResponse(memoryStream, "Report2.pdf", "application/pdf");

  33:          memoryStream.Close();

  34:      }

  35:  }

  36:  #endregion //Export


  38:  #region SendStreamToResponse

  39:  private void SendStreamToResponse(MemoryStream stream, string fileName, string contentType)

  40:  {

  41:      var reportBuffer = stream.ToArray();

  42:      Response.AddHeader("Content-Length", reportBuffer.Length.ToString());

  43:      Response.ContentType = contentType;

  44:      Response.AddHeader("Expires", "0");

  45:      Response.AddHeader("Cache-Control", "must-revalidate, post-check=0, pre-check=0");

  46:      Response.AddHeader("Pragma", "public");

  47:      Response.AddHeader("Content-Disposition", "attachment; filename=" + fileName);

  48:      Response.BinaryWrite(reportBuffer);

  49:      Response.Flush();

  50:      Response.End();

  51:  }

  52:  #endregion //SendStreamToResponse


  54:  #endregion //Methods


  56:  #region EventHandlers


  58:  #region Button1Click

  59:  protected void Button1Click(object sender, EventArgs e)

  60:  {

  61:      Export();

  62:  }

  63:  #endregion //Button1Click


  65:  #endregion //EventHandlers


Run the application and filter customers by country for France. Look at the results.


Export data. The generated PDF contains only customers from France.


Enjoy! Infragistics Reporting could be used almost anywhere. You could integrate it easy in different WEB applications.You could add Infragistics reports at a later stage to your web sites.


Source code you could find here:

About Mihail Mateev

am a Microsoft Regional Director currently living in Sofia, Bulgaria. My interests range from technology to entrepreneurship. I am also interested in programming, web development, and education. Technical Consultant, Community enthusiast, PASS Regional Mentor for Central Eastern Europe, chapter lead, Microsoft MVP – Microsoft Azure. Organizer of SQLSaturday, Azure Bootcamp, IoT and JavaScript conferences. My experience is in various areas related to Microsoft technologies, including Windows Platform, ASP.Net MVC, MS SQL Server and Microsoft Azure. I have a PhD in cloud computing and am a university lecturer on Smart Homes and Smart Energy IoT Solutions
This entry was posted in Uncategorized. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s