ReportViewer and ASP.NET MVC?

[Timo Saikkonen]

Hi,

Have you experimented with ReportViewer on the ASP.NET MVC framework? I'd really like to leverage both in a project but can't seem to get the report viewer to work. I'm using a Report object as the model for the view and basically showing the ReportViewer as follows:

<asp:Content ContentPlaceHolderID="MainContent" runat="server">
    <form runat="server">
    <%
        rvReport.Report = ViewData.Model;
    %>
    <telerik:ReportViewer ID="rvReport" runat="server" />
    </form>
</asp:Content>

The attempt results in an error message:

Report is unavailable or session has expired.

---

Please, refresh the page.

[Chavdar]

Hello Timo Saikkonen,

The problem here is not with the MVC framework but rather with the server side code used in the snippet. Written in this way it will be executed when the page is rendered which is already too late to set a report for the Report property of the viewer. A possible way to workaround this is to set the report earlier, either on Page_Load or OnPreRender. For example you can try in the following ways:

       

<script runat="server">

protected override void OnPreRender(EventArgs e)

{

rvReport.Report = ViewData.Model;

base.OnPreRender(e);

}

</script>

<asp:Content ContentPlaceHolderID="MainContent" runat="server">

<form runat="server">

<telerik:ReportViewer ID="rvReport" runat="server" />

</form>

</asp:Content>

or

<script runat="server">
  protected void Page_Load(object sender, EventArgs e)
  {
    rvReport.Report = ViewData.Model;
  }
</script>
<asp:Content ContentPlaceHolderID="MainContent" runat="server">
  <form runat="server">
    <telerik:ReportViewer ID="rvReport" runat="server" />
   </form>
</asp:Content>

Hope this helps.

Greetings,
Chavdar
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Timo Saikkonen]

Oh cool. That works. I kinda thought MVC gets rid of the event handling mechanism.

[Chavdar]

Hi Timo Saikkonen,

It would have been better if these events were not used, but at this moment the ReportViewer control is not adapted to the MVC framework. It is a standard asp.net server control which relies on the classic Web Forms behavior including page lifecycle, viewstate, postback mechanism, etc. We would consider enhancing the viewer to support MVC for future releases.

Sincerely yours,
Chavdar
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[Seth Juarez]

Any idea when this adaptation will be made? The client I work for is very interested in a reporting tool for the ASP.NET MVC model. This will dictate whether or not they buy several licenses of you product.

[Chavdar]

Hello Seth Juarez,

There should be no problem to use the current version of the ReportViewer control in the MVC framework. Still, you will have to use the suggested approach in one of my previous replies. We will do our best to improve the viewer as soon as possible but at this moment we cannot give you an exact time estimate.

Greetings,
Chavdar
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[TIM JENKINS]

Chavdar,

I'm new to using Telerik but was asked to create a Telerik Report that will be displayed in an ASP.MVC app.  I've created a report that uses a business object for the DataSource.  [1] I have the business object and a service that will generate a list of business objects in a second class library.  [2] I also have the report in it's own class library (referencing [1]).    And the website is sitting in it's own solution with referencing [1], [2] and Telerik.Reporting.  My questions are:

* Do I need to do anything to my web.config and/or masterpage.master?

* Where should I place my telerik:ReportViewer control, in a page or user control?

* After I've built a list of business objects (based on user input), what property do I need to set other than .DataSource in the controller?  Would it be better to pass my parameters to the report, have the report call the service with the parameters, then use the service results to fill the report?

Are there any references out there on what to do next?  Or can you get me started?

Thanks!

[Steve]

Hello Tim,

Up to your questions:

• it depends on how you've built your report and where you intend to keep the connectionString. This KB article shares more light on the subject.
• as previously explained, the viewer is a standard asp.net server control, so where it is placed is entirely up to you.
• whether you would build your "filtered" query prior to binding the report or leave the filtering to the report is again up to you. The latter approach however would pull all data in order to filter and this has its performance toll.

Sincerely yours,
Steve
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[TIM JENKINS]

I still cannot get this to work and I'm hoping to can shine some light on the matter.

My MVC website has the Telerik.Reporting and Telerik.ReportViewer.WebForms references added with Copy Local = ture.

In my web.config, I added (the bold to the following sections):

<system.web>
  <compilation debug="true">
    <assemblies>
     ...
        <add assembly="Telerik.ReportViewer.WebForms, Version=3.1.9.807, Culture=neutral, PublicKeyToken=A9D7983DFCC261BE"/>
        <add assembly="Telerik.Reporting, Version=3.1.9.807, Culture=neutral, PublicKeyToken=A9D7983DFCC261BE"/>
        <add assembly="System.Design, Version=2.0.0.0, Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/>
     ...
    </assemblies>
     ...
  <httpHandlers>
   ...
       <add path="Telerik.ReportViewer.axd" verb="*" type="Telerik.ReportViewer.WebForms.HttpHandler, Telerik.ReportViewer.WebForms, Version=3.1.9.807, Culture=neutral, PublicKeyToken=a9d7983dfcc261be" validate="true"/>
   ...

     ...  </httpHandlers>
   ...
</system.web>
<system.webServer>
  <handlers>
    ...
      <add name="Telerik.ReportViewer.axd_*" path="Telerik.ReportViewer.axd" verb="*" type="Telerik.ReportViewer.WebForms.HttpHandler, Telerik.ReportViewer.WebForms, Version=3.1.9.807, Culture=neutral, PublicKeyToken=a9d7983dfcc261be" preCondition="integratedMode,runtimeVersionv2.0"/>
    ...
  </handlers>
</system.webServer>

This is my View (tr_Report.ascx):
<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<TelerikReports.myReport>" %>
<%@ Register assembly="Telerik.ReportViewer.WebForms, Version=3.1.9.807, Culture=neutral, PublicKeyToken=a9d7983dfcc261be" namespace="Telerik.ReportViewer.WebForms" tagprefix="telerik" %>
<script runat="server">                       
  protected override void OnPreRender(EventArgs e)
  {
    rvReport.Report = ViewData.Model;
    base.OnPreRender(e);
  }
</script>
<form id="Form1" runat="server">
  <telerik:ReportViewer ID="rvReport" runat="server" />
</form>


This is my controller code:

        public ActionResult GetReport(DateTime? start, DateTime? end)
        {
                TelerikReports.myReport report = new TelerikReports.myReport();
                report.DataSource = ReportsService.GetData(start.Value, end.Value);
                return View("tr_Report", report);
        }

At this point, I do not know what I'm missing.  In IE, I got nothing, so I used Firefox and in Firebug I get this error:

Could not load file or assembly 'System.Web.Extensions, Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35' or one of its dependencies. The located assembly's manifest definition does not match the assembly reference. (Exception from HRESULT: 0x80131040)

[Sam]

This thread has been a good help, but I'm stuck..

I've followed the direction, added the onload call and viewdata.  The report viewer displays however there is no data.. I suspect it is from a javascript error that is occurring:

Error: missing variable name
Source File: http://localhost:3693/Blast.mvc
Line: 265, Column: 5
Source Code:
 var 9d861716-9172-435b-99c6-d750022c6e96_rvReport = new ReportViewer('9d861716-9172-435b-99c6-d750022c6e96_rvReport','9d861716-9172-435b-99c6-d750022c6e96_rvReport_ReportToolbar','9d861716-9172-435b-99c6-d750022c6e96_rvReport_ReportArea_WaitControl','9d8

It seems that invalid javascript variable names are being generated.. Anyone have any ideas?

Thanks.

[Chavdar]

Hi Sam,

The ReportViewer control on the client side creates a javascript object with the same name as its ClientID. In your case the ClientID starts with a digit which is not a valid identifier for a javascript object. Therefore you have to modify the way the ClientID is generated so that it forms a valid identifier.

All the best,
Chavdar
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[devika godse]

I did the same thing..

<asp:Content ID="Content2" ContentPlaceHolderID="Content" runat="server">
<script runat="server">                       
  protected override void OnPreRender(EventArgs e)
  {
     rvReport.Report = ViewData.Model;
  }
</script>
<form id="Form2" runat="server">
     <telerik:ReportViewer ID="rvReport" runat="server" />  
 </form>  
</asp:Content>

but got error :

The control collection cannot be modified during DataBind, Init, Load, PreRender or Unload phases.

that means the event OnPreRender is not executed..

[Steve]

Hello devika,

Check out the following code library that elaborates on using the web report viewer in MVC applications and contains sample project: Using Telerik Web ReportViewer in ASP.NET MVC application.

All the best,
Steve
the Telerik team

[Steven]

The version numbers are out-of-date.  After updating to the number to 4.1.10.921, I get:

Server Error in '/' Application.

Compilation Error

Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately.

Compiler Error Message: CS0266: Cannot implicitly convert type 'ClassLibrary1.Report1' to 'Telerik.Reporting.IReportDocument'. An explicit conversion exists (are you missing a cast?)

Source Error:

Line 21:             

Line 22:             // bind the report viewer

Line 23:             ReportViewer1.Report = new ClassLibrary1.Report1();

Line 24:         }

Line 25:     </script>

Source File: c:\Users\...\TelerikReportingAspNetMvc\Views\Home\Index.aspx    Line: 23 

However for my real application, I am getting the same:
The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).

With 

<asp:Content ID="indexContent" ContentPlaceHolderID="MainContent" runat="server">
    
    <script runat="server">
        
        public override void VerifyRenderingInServerForm(Control control)
        {
            // to avoid the server form (<form runat="server">) requirement
        }
 
        protected override void OnLoad(EventArgs e)
        {
            base.OnLoad(e);
            
            // bind the report viewer
            ReportViewer1.Report = new ClassLibrary1.Report1();
        }
    </script>
    <telerik:ReportViewer runat="server" ID="ReportViewer1" />

Already copied over with a few modifications.

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>

<script runat="server">
    public override void VerifyRenderingInServerForm(Control control)
    { /* to avoid the server form (<form runat="server">) requirement */
    }
    protected void OnLoad(EventArgs e)
    {
        base.OnPreRender(e);
    }
</script>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    ReportViewer
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <h2>
        ReportViewer</h2>
    <tlrk:ReportViewer runat="server" ID="rptViewer" ReportBookID="rptBook"
        Skin="Office2007" />
    <tlrk:ReportBookControl ID="rptBook" runat="server">
        <Reports>
            <tlrk:ReportInfo Report="MyApp.Views.Reports.rptUserList, MyApp, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null" />
        </Reports>
    </tlrk:ReportBookControl>
</asp:Content>

New Info: KB article Runtime Troubleshooting

Dictates that <head> must have runat="server" in order for the report to have the right CSS style

MVC dictates you must have

<%=
     Html.Telerik().StyleSheetRegistrar()
        .DefaultGroup(group => group
            .Add("telerik.common.css")
            .Add("telerik.telerik.css")
            .Add("telerik.office2007.min.css"))
    %>

Or some variance therein. Plus I am using:

<link href="<%: Url.Content("~/Content/reset.css") %>" rel="stylesheet" type="text/css" />
<link href="<%: Url.Content("~/Content/Site.css") %>" rel="stylesheet" type="text/css" />
<link href="<%: Url.Content("~/Content/960.css") %>" rel="stylesheet" type="text/css" />
<link href="<%: Url.Content("~/Content/smoothness/jquery-ui-1.8.4.custom.css") %>"
    rel="stylesheet" type="text/css" />
<script src="<%: Url.Content("~/Scripts/MicrosoftAjax.debug.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts//MicrosoftMvcValidation.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/MicrosoftAjax.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/MicrosoftMvcAjax.debug.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/MicrosoftMvcValidation.debug.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/jquery-1.4.2.min.js") %>" type="text/javascript"></script>
<script src="<%: Url.Content("~/Scripts/jquery-ui-1.8.4.custom.min.js") %>" type="text/javascript"></script>
<% /* %>
<script src="/MyApp/Scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
<script src="/MyApp/Scripts/jquery.validate-vsdoc.js" type="text/javascript"></script>
<% */ %>

[Steve]

Hello Steven,

Can you share what version numbers are out of date? If you refer to code we've posted, then this is expected - as long as code works correctly with latest version we do not update the projects.
For your convenience I've attached the project from the code library, upgraded to the latest Q2 SP1 released yesterday and working as expected.
As for the "The Controls collection cannot be modified.." error, it is a generic one and you can find more info on it in the following article.

Greetings,
Steve
the Telerik team

[Sue Dong]

I simply want to have a page to show a Telerik report using a ReportViewer.WebForm, but no luck.  What's more frustrating is that, the telerikreportingaspnetmvc2vs2010.zip sample, provided in link http://www.telerik.com/community/forums/reply-thread.aspx?messageId=0&threadId=155875 works.  I am using Q1 2010 version.

I imported the working ClassLibrary1 project over to my solution. In the controller, simply have:

public ActionResult PdfTest()

{

    return View();

}

 

 

 

 

The view code:

 

 

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>

 

<%@ Register Assembly="Telerik.ReportViewer.WebForms, Version=4.0.10.423, Culture=neutral, PublicKeyToken=a9d7983dfcc261be" Namespace="Telerik.ReportViewer.WebForms" TagPrefix="telerik" %>

 

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">

 

       PdfTest

 

</asp:Content>

 

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

 

     <script runat="server">

 

        public override void VerifyRenderingInServerForm(Control control)

 

        { // to avoid the server form (<form runat="server">) requirement}

 

 

 

        protected override void OnLoad(EventArgs e)

 

        {

 

            base.OnLoad(e);

 

            ReportViewer2.Report = new ClassLibrary1.Report1();

 

        }

 

 

 

   </script>

 

   <telerik:ReportViewer ID="ReportViewer2" runat="server"></telerik:ReportViewer>

 

</asp:Content>

 

 

 

Have added those telerik lines to the web.config and added all the references.  However, I am getting:

The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).

Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code.

Exception Details: System.Web.HttpException: The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).

Source Error:

An unhandled exception was generated during the execution of the current web request. Information regarding the origin and location of the exception can be identified using the exception stack trace below.

Stack Trace:

[HttpException (0x80004005): The Controls collection cannot be modified because the control contains code blocks (i.e. <% ... %>).]    System.Web.UI.ControlCollection.Add(Control child) +8701175    Telerik.ReportViewer.WebForms.ReportViewer.OnLoad(EventArgs e) +350    System.Web.UI.Control.LoadRecursive() +74    System.Web.UI.Control.LoadRecursive() +146    System.Web.UI.Control.LoadRecursive() +146    System.Web.UI.Control.LoadRecursive() +146    System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +2207

 

---

Version Information: Microsoft .NET Framework Version:4.0.30319; ASP.NET Version:4.0.30319.1

Please HELP!!!!!  If necessary, I can open a ticket to attach my little solution folder

[Peter]

Hello Sam,

The problem is due to the code block used in the MasterPage to register the CSS. You have to replace the
<%: with <%# . Just to note that in a new ASP.NET MVC Web Application the styles are defined in the Site.css style sheet. It specifies global styles for all table, table td and table th html elements without any restrictions which causes the problem. To fix the report viewer appearance, I have removed those styles from the Site.css. To customize table elements you can always create a custom style class and use the class attribute of the respective html elements to point to this class.

I have attached an updated sample project.

All the best,
Peter
the Telerik team

[Sue Dong]

This is Sue.  Thanks for reply.  It is extremely helpful, as I never imagine that <%# instead of <%: would do such a magic.  Supposedly, <%= is the older version of <%:, not sure what is <%#.  However, magic happened.
As for Site.css, I found that you do not need to completely exclude that.  The only offending elements are the table, and input[type="text"], input[type="password"].  Remove those and everything is fine.

[Michael]

Is it possible to render these reports as a partial view in razor??

[Steve]

Hello Michael,

The following forum thread elaborates on your inquiry: ReportViewer and ASP.NET MVC 3 - Razor.

All the best,
Steve
the Telerik team

[Igor]

Hello!
I am interesting in the thread  ReportViewer and ASP.NET MVC 3 - Razor, but it seems to be missed on your server.
Is there any points?

[frank]

i would like some samples of how the report viewer works with mvc 3 with razor too. 

[Paul]

Hi there

Have a look at http://fullsaas.blogspot.com/2011/02/how-to-use-telerik-report-in-aspnet-mvc.html
and http://www.telerik.com/community/forums/aspnet-mvc/general/reporting-in-mvc-with-razor.aspx

Cheers
Paul

[Igor]

Thnx Paul, these links were very useful

[Atanas]

Hello Igor,

This URL: http://www.telerik.com/community/forums/reporting/telerik-reporting/reportviewer-and-asp-net-mvc-3-razor.aspx was broken and we just fixed so you can read it if you want to.


Greetings,
Atanas
the Telerik team

[Neeta]

Can someone help me to know, how to bind Report from teleriks to .aspx page.?

[Igor]

Neeta, what the web application type you using to show the reports - WebForms or ASP .NET MVC or ...?
please give more details