Telerik Reports are Class based, so we will create a Class Library Project to contain Telerik Reports.
To feed the Telerik Reports with data using Entity Data Model, we cannot use the EDM located in the Silverlight Web project; as a circular dependency issue will rise once we add a reference to the Silverlight Web project from the Telerik Report Class Library project. As an alternative, we can create a new Class Library Project to contain the Entity Data Model that will feed the Telerik Report Class Library project.
To display the Telerik reports in Silverlight project we need to add few assemblies that will enable us to add the Telerik Report Viewer to the views.
Telerik Report Viewer need to see the Telerik Reports located in the Class Library Project, to enable this, Telerik provided the solution by adding a web service on the Silverlight Web project.
So, our Solution will hold four projects:
Silverlight project (SLBAReport),
Silverlight Web project (SLBAReport.Web),
Class Library to hold the Telerik Reports (ReportLibrary) and
Class Library to hold the Entity Data Model to feed the Telerik Report Project (DBLibrary).
Fire up Microsoft Visual Studio 2010 and create a new Solution (SLTelerikReport) containing Silverlight Business Application (SLBAReport).
Adding the Telerik Report Project to the solution
Right click the Solution, add new project.
Choose Class Library (ReportLibrary).
Delete the default class Class1.cs
Adding the Database Project to the solution
Right click the Solution, add new project.
Choose Class Library (DBLibrary).
Delete the default class Class1.cs
Now, our solution contain the four projects we need.
Adding References
ReportLibrary projectRight click References under ReportLibrary project, and choose Add Reference…
Choose: Projects tab, and choose: DBLibrary
Choose: .NET tab, and choose: System.Data.Entity
SLBAReport projectRight click References under SLBAReport project, and choose Add Reference…
Choose: .NET tab, and choose the following:
System.Windows.Controls (it is added by default)
Telerik.Windows.Controls
Telerik.Windows.Controls.Input
Telerik.Windows.Controls.NavigationChoose: Browse tab, and locate
Telerik.ReportViewer.Silverlight.dllIn the Telerik Examples folder: C:\Program Files (x86)\Telerik\Reporting Q1 2012\Examples\CSharp\SilverlightDemo\bin\
SLBAReport.Web projectRight click References under SLBAReport.Web project, and choose Add Reference…
Choose: Projects tab, and choose DBLibrary
Choose: Projects tab, and choose ReportLibrary
Building the Projects
DBLibrary Project
Right click the project and choose, Add, Choose New Item
Choose: ADO.NET Entity Model (DBModel), press Next
Choose: Generate from database, press Next
Choose or create your database connection and save it (DBEntities)
Select the Tables, Views you want to include in your Entity Data Model
Save and Complete the Wizard
P.S: I added a Table (CountryLookup) that contains (CountryID, and CountryName).
Open the App.Config in the DBLibrary Project and copy the DBEntities Connection String tag.
My connection string tag:
<add name="DBEntities" connectionString="metadata=res://*/DBModel.csdl|res://*/DBModel.ssdl|res://*/DBModel.msl;provider=System.Data.SqlClient;provider connection string="Data Source=.\SQLEXPRESS;Initial Catalog=TestDB;Integrated Security=True;MultipleActiveResultSets=True;Application Name=EntityFramework"" providerName="System.Data.EntityClient" />
In the SLBAReport.Web Project, open the Web.Config and paste the copied connection string within the ConnectionStrings tag.
The reason behind doing the last step is: at run time, only the startup Project connection strings are respected, so we need to copy our connection string from the DBLibrary Project to the Startup SLBAReport.Web Project.
Report Library Project
Right click the project and choose, Add, Choose New Item
Choose Telerik Report Q1 2012, or whatever version you have.
Let’s leave the default name Report1.cs and choose Add.
The Telerik Report Wizard will pop up, press Cancel.
The Report designer is displayed with three main sections: Header, Details and Footer.
From the Toolbox, drag a TextBox into the Details section.
Double Click the Textbox, type =Fields.CountryName
Right click on the Report and choose View Code, this will open up the Code behind file.
Define an instance of the DBEntities (_context)
Initialize the _context and set the Report Data Source.
public partial class Report1 : Telerik.Reporting.Report
{
private DBEntities _context = null;
public Report1()
{
InitializeComponent();
_context = new DBEntities();
this.DataSource = _context.CountryLookup;
}
}
Notice that both DBLibrary and ReportLibrary projects are running on the server, so we can communicate with the Entity Data Model directly. Unlike the Client projects that require the Domain Service.
SLBAReport.Web Project
Right click the Services folder in the SLBAReport.Web project, choose: Add, New Item.
Choose: TextFile (ReportService.svc).
Copy and paste the following line in the ReportService.svc file.
<%@ServiceHost Service="Telerik.Reporting.Service.ReportService, Telerik.Reporting.Service, Version=6.0.12.215, Culture=neutral, PublicKeyToken=A9D7983DFCC261BE" %>
Notice that Version=6.0.12.215 is the version of the used Telerik Report Viewer we are using.
You can find out which version you are using by following:
In SLBAReport Project,
Expand the Reference folder
Right click on Telerik.ReportViewer.Silverlight, Remember we have added this reference earlier.
Choose Properties and find Version.
Double click the Web.Config, reach to the bottom.
We will replace the following System.ServiceModel tag<system.serviceModel>
<serviceHostingEnvironment aspNetCompatibilityEnabled="true" multipleSiteBindingsEnabled="true" />
</system.serviceModel>
With the following :
<system.serviceModel> <serviceHostingEnvironment aspNetCompatibilityEnabled="true" /> <services> <service name="Telerik.Reporting.Service.ReportService" behaviorConfiguration="ReportServiceBehavior"> <endpoint address="" binding="basicHttpBinding" contract="Telerik.Reporting.Service.IReportService"> <identity> <dns value="localhost" /> </identity> </endpoint> <endpoint address="resources" binding="webHttpBinding" behaviorConfiguration="WebBehavior" contract="Telerik.Reporting.Service.IResourceService"/> <endpoint address="mex" binding="mexHttpBinding" contract="IMetadataExchange" /> </service> </services> <behaviors> <serviceBehaviors> <behavior name="ReportServiceBehavior"> <serviceMetadata httpGetEnabled="true" /> <serviceDebug includeExceptionDetailInFaults="false" /> </behavior> </serviceBehaviors> <endpointBehaviors> <behavior name="WebBehavior"> <webHttp /> </behavior> </endpointBehaviors> </behaviors> </system.serviceModel>
SLBAReport Project
Expand the Views folder in the SLBAReport project, and double click the Home.xaml
From the Toolbox, drag ReportViewer on the Home.xaml (reportViewer1)
Adjust the width and height by dragging the control edges.
We need to set couple of properties for the Report Viewer control: Report and ReportServiceUri.
We can do this either in XAML:
<telerik:ReportViewer Name="reportViewer1" ReportServerUri="../Services/ReportService.svc"
Report="ReportLibrary.Report1, ReportLibrary"/>
Or in Code behind:
Right click Home.xaml, choose View Code.
In the OnNavigatedTo event paste the following: protected override void OnNavigatedTo(NavigationEventArgs e)
{
this.reportViewer1.ReportServiceUri = new Uri("../Services/ReportService.svc", UriKind.RelativeOrAbsolute);
this.reportViewer1.Report = "ReportLibrary.Report1, ReportLibrary";
}
Save All, Clean, Rebuild and Run
