ReportViewer and ASP.NET MVC 3 - Razor

36 posts, 0 answers
  1. y
    y avatar
    5 posts
    Member since:
    Sep 2007

    Posted 08 Dec 2010 Link to this post

    Hi,

    What is the best way to implement the report viewer using MVC 3 project with the Razor engine?

    Thanks

  2. Saud Almutairi
    Saud Almutairi avatar
    23 posts
    Member since:
    Oct 2006

    Posted 02 Jan 2011 Link to this post

    any updates on this issue.... the sample for ReportViewer with MVC is old... please provide one with MVC 3 Razor Engine


    thanks



  3. Steve
    Admin
    Steve avatar
    10942 posts
    Member since:
    Feb 2014

    Posted 04 Jan 2011 Link to this post

    Hi y,

    Telerik Reporting does not have out of the box support for MVC and thus we have included such project in our code library section. Moreover MVC 3 is still not official and we have not yet looked at that direction, especially having in mind that we do not have a dedicated MVC report viewer. Once MVC 3 becomes official, we would review any problems that might arise with the workaround we have provided so far.

    Kind regards,
    Steve
    the Telerik team

    Get started with Telerik Reporting with numerous videos and detailed documentation.

  4. Saud Almutairi
    Saud Almutairi avatar
    23 posts
    Member since:
    Oct 2006

    Posted 18 Jan 2011 Link to this post

    any updates on this, as MVC 3 is now RTM

  5. Steve
    Admin
    Steve avatar
    10942 posts
    Member since:
    Feb 2014

    Posted 21 Jan 2011 Link to this post

    Hello Saud,

    We've tested the project from the Using Telerik Web ReportViewer in ASP.NET MVC application code library with MVC and it works fine with the ASPX view engine. As you have probably read by now from ScottGu posts, you cannot use web controls in any way in the Razor view engine, there are no postbacks, viewState etc. that our ASP.NET viewer depends on.

    Kind regards,
    Steve
    the Telerik team

    Get started with Telerik Reporting with numerous videos and detailed documentation.

  6. Marc
    Marc avatar
    17 posts
    Member since:
    Sep 2012

    Posted 09 Feb 2011 Link to this post

    You could just include MVC2 page with report viewer in a MVC 3 page

    @Html.Partial("ViewPageTestReport")

    ViewPageTestReport in a ASCX page

  7. David
    David avatar
    2 posts
    Member since:
    Feb 2011

    Posted 16 Feb 2011 Link to this post

    Hello, do you could share your code where you put in reportviewer partial file?
    Thank you
    David

  8. Marc
    Marc avatar
    17 posts
    Member since:
    Sep 2012

    Posted 17 Feb 2011 Link to this post

    I'm writing a small post blog to explain that with an example

  9. David
    David avatar
    2 posts
    Member since:
    Feb 2011

    Posted 17 Feb 2011 Link to this post

    Thank you Raynald

  10. Marc
    Marc avatar
    17 posts
    Member since:
    Sep 2012

    Posted 17 Feb 2011 Link to this post

    You find it here

  11. Michael
    Michael avatar
    105 posts
    Member since:
    Nov 2010

    Posted 18 Mar 2011 Link to this post

    Brilliant Raynard,

    I have the viewer working, but the same css problems (i think).

    The Viewer is running inside a tabcontrol and as you can see from the screen shot its all a little awkward (still repeating the page controls/print etc)

    I've replaced the default site.css file with that from the telerik example (table styles removed) but this made no difference to the layout.

    I followed Raynard's video and noticed a seperate reports.css so i am hoping this is my solution??, there's no link to code from the website so would appreciate this style to try to fix my problem. 

    (Oh.... Firefox 4 Beta seems to dislike the standard MVC site menu css!!)

  12. Marc
    Marc avatar
    17 posts
    Member since:
    Sep 2012

    Posted 18 Mar 2011 Link to this post

    Oupps, I have deleted it...
    It's ok now, you can download it from http://yurl.fr/adluh

  13. Michael
    Michael avatar
    105 posts
    Member since:
    Nov 2010

    Posted 19 Mar 2011 Link to this post

    The 2 Css files didn't make a difference...I wonder if its because my partial view is inside the teleriktabstrip??

  14. Joseph
    Joseph avatar
    14 posts
    Member since:
    Mar 2011

    Posted 23 Mar 2011 Link to this post

    Hi Michael,

    I'm having the same issue but only when the view (mine's a partial view, ascx) is  called via render.partialview().

    Have you managed to get around it?

    regards,
    James


    EDIT: Michael.

    You might find this useful
    http://www.telerik.com/support/kb/reporting/report-viewers/the-styles-of-the-web-report-viewer-s-toolbar-are-messed-up.aspx

  15. Jeff Jorczak
    Jeff Jorczak avatar
    10 posts
    Member since:
    Apr 2010

    Posted 23 Jun 2011 Link to this post

    When is Telerik going to release an Html.ReportViewer helper method for MVC?

  16. Saud Almutairi
    Saud Almutairi avatar
    23 posts
    Member since:
    Oct 2006

    Posted 07 Jul 2011 Link to this post

    Telerik Report Helper Method would be Great - at least you can give us the implementation code.

    thanks

  17. kfrancis
    kfrancis avatar
    58 posts
    Member since:
    Dec 2008

    Posted 24 Feb 2012 Link to this post

    Please -Telerik developers,

    I beg you to look into this further, at least to provide a workaround for your customers who are using MVC and want the option to use the Razor view engine. Now that MVC 4 is in beta, it'd be nice to see a solution for MVC3 - as the argument that it's not important doesn't really apply any more.

    I'm trying to convert my whole office, but this issue will make me reconsider not renewing my ultimate subscription again because it looks as if you're not interested in MVC.

  18. Saud Almutairi
    Saud Almutairi avatar
    23 posts
    Member since:
    Oct 2006

    Posted 24 Feb 2012 Link to this post

    i second that

  19. Chris
    Chris avatar
    2 posts
    Member since:
    Jun 2011

    Posted 29 Feb 2012 Link to this post

    So true; any application that takes its users serious will have to have some sort of reporting and buying into the Telerik suite I thought I'd get this too. Please give us something like @Html.ReportViewer to work with!

    Kind regards,

    Chris

  20. Steve
    Admin
    Steve avatar
    10942 posts
    Member since:
    Feb 2014

    Posted 01 Mar 2012 Link to this post

    Hi guys,

    We've never claimed that MVC is not important, let there be no doubt about that. We always work towards presenting tools that ease the daily job of developers and MVC is not an exception, as you can see our MVC suite has grown enormously since its introduction and it is only a matter of time to create a native MVC report viewer as well.
    For the time being you can include partial view with the web report viewer in a MVC 3 page

    @Html.Partial("ViewPageTelerikReport")

    You can see a short video on the matter here.

    All the best,
    Steve
    the Telerik team
    NEW in Q1'12: Telerik Report Designer (Beta) for ad-hoc report creation. Download as part of Telerik Reporting Q1 2012. For questions and feedback, use the new Telerik Report Designer Forum.

  21. Chris
    Chris avatar
    2 posts
    Member since:
    Jun 2011

    Posted 01 Mar 2012 Link to this post

    Yeah, I am using that right now. But it isn't as flexible as I would like it to be. Good to hear that you are working towards a native MVC report viewer though! I'll be looking out for that one.
    Keep up the great work,

    Chris

  22. dalexsoto
    dalexsoto avatar
    7 posts
    Member since:
    Jul 2009

    Posted 31 May 2012 Link to this post

    I hpoe you integrate telerik reporting on kendo ui for Asp.net MVC because afaik Telerik Asp mvc controls will be discountinued on 2013 right?

  23. Steve
    Admin
    Steve avatar
    10942 posts
    Member since:
    Feb 2014

    Posted 01 Jun 2012 Link to this post

    Hello dalexsoto,

    Whenever there is a native MVC viewer, it would be part of the reporting suite and not part of the mvc controls.

    Greetings,
    Steve
    the Telerik team

    BLOGGERS WANTED! Write a review about Telerik Reporting or the new Report Designer, post it on your blog and get a complimentary license for Telerik Reporting. We’ll even promote your blog and help bring you a few fresh readers. Yes, it’s that simple. And it’s free. Get started today >

  24. AkAlan
    AkAlan avatar
    117 posts
    Member since:
    Jun 2009

    Posted 22 Jul 2012 Link to this post

    I have been able to get a report to work in an MVC 3 application by following the video posted earlier. How is it possible to pass parameters to a report that uses a SqlDataSource in an MVC applilcation?

  25. IvanY
    Admin
    IvanY avatar
    410 posts
    Member since:
    Sep 2012

    Posted 23 Jul 2012 Link to this post

    Hello Alan,

    Passing parameters to a report in an MVC application is no different than doing so in a classic ASP.NET application. Because the Report Viewer is in a view you can simply use the ViewBag to pass parameters from the controller to the view - it does not matter that the view is not cshtml but aspx. As an example you can do this:

    protected override void OnLoad(EventArgs e)
    {
      base.OnLoad(e);
      var instanceReportSource = new Telerik.Reporting.InstanceReportSource();
      instanceReportSource.ReportDocument = new Reports.Sample();
                 
      instanceReportSource.Parameters.Add(new Telerik.Reporting.Parameter("Parameter1", ViewBag.Text));
     
      ReportViewer1.ReportSource = instanceReportSource;
    }

    Additionally you can make the View strongly typed and pass the model class through your controller. 

    All the best,
    IvanY
    the Telerik team

    BLOGGERS WANTED! Write a review about Telerik Reporting or the new Report Designer, post it on your blog and get a complimentary license for Telerik Reporting. We’ll even promote your blog and help bring you a few fresh readers. Yes, it’s that simple. And it’s free. Get started today >

  26. AkAlan
    AkAlan avatar
    117 posts
    Member since:
    Jun 2009

    Posted 23 Jul 2012 Link to this post

    Thanks IvanY, I will try that out. I would really be interested in seeing an example of how to bind a report to a model on a strongly typed View. There does not seem to be any documetation for using MVC and Telerik Reporting.  

  27. IvanY
    Admin
    IvanY avatar
    410 posts
    Member since:
    Sep 2012

    Posted 24 Jul 2012 Link to this post

    Hi Alan,

    The approach to make a strongly typed View with Telerik Reporting is pretty straightforward too. In your view (which is an aspx page because of the Report Viewer) you can do this:

    <%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<Telerik.Reporting.ReportSource>" %>
     
    <%@ Register Assembly="Telerik.ReportViewer.WebForms, Version=6.1.12.621, Culture=neutral, PublicKeyToken=a9d7983dfcc261be" Namespace="Telerik.ReportViewer.WebForms" TagPrefix="telerik" %>
     
    <!DOCTYPE html>
    <html><head></head>
    <body>
        <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);
                ReportViewer1.ReportSource = Model;
            }
     
        </script>
        <form id="main" method="post" action="">
            <telerik:ReportViewer ID="ReportViewer1" Width="100%" Height="800px" runat="server"></telerik:ReportViewer>
        </form>
    </body>
    </html>

    Then in your controller you will have to pass the instance of the report source (or URI, XML, Type - for more information please check the Report Sources help article):
    public ActionResult Index()
    {
      var instanceReportSource = new Telerik.Reporting.InstanceReportSource();
      instanceReportSource.ReportDocument = new Sample();
     
       // Of course passing parameters is optional
      instanceReportSource.Parameters.Add(new Telerik.Reporting.Parameter("Parameter1", parameterObjectHere));
     
      // Here you can return to the view one of the other report sources as well, check the link above
      return View(instanceReportSource);
    }

    I hope that helps.

    All the best,
    IvanY
    the Telerik team

    BLOGGERS WANTED! Write a review about Telerik Reporting or the new Report Designer, post it on your blog and get a complimentary license for Telerik Reporting. We’ll even promote your blog and help bring you a few fresh readers. Yes, it’s that simple. And it’s free. Get started today >

  28. dalexsoto
    dalexsoto avatar
    7 posts
    Member since:
    Jul 2009

    Posted 24 Jul 2012 Link to this post

    Ok, it works and shows the report but the buttons of the reportviewer appears all messed up and repeated i guess its a css problem, how to fix it??

  29. AkAlan
    AkAlan avatar
    117 posts
    Member since:
    Jun 2009

    Posted 24 Jul 2012 Link to this post

    If you watch This video that was mentioned in a previous post on this forum, he shows you what to edit in your site.css file to fix that. I followed his instructions and it worked for me. BTW,  the video has no audio.

  30. Ed
    Ed avatar
    1 posts
    Member since:
    Aug 2012

    Posted 06 Aug 2012 Link to this post


    You may not be able to use the ReportViewer in a Razor view, but you can include a partial view that is an ASPX (WebForm) page. As long as the page is in a default location, it works fine; if you want to put it in a custom location, things get trickier, but still possible.

    You can have a Razor view include an ASPX partial view, as follows. The referenced Telerik demo (Using Telerik Web ReportViewer in ASP.NET MVC application) is out of date for the Q2 2012 Reporting, but the same concepts still apply. I have the following action in my controller:

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.Mvc;
    using MyProject.Helpers;
     
     
    namespace MyProject.Controllers
    {
        public class ReportsController : Controller
        {
            public ActionResult Index()
            {
                // Menu of reports.
                return View();
            }
             
            public ActionResult ReportView(string id)
            {
                ViewBag.Title = id;
                ViewBag.ReportViewName = "InvalidReport";
                switch (id.ToLower())
                {
                case "mydemoreport":
                    ViewBag.Title = "Demo Report";
                    ViewBag.ReportViewName = "MyDemoReportASPX";
                    break;
                }
                return View();
            }
        }
    }

    This is my Razor view, ReportView.cshtml, that includes the ASPX page the calls the report viewer, MyDemoReportASPX.aspx. By changing the contents of the ViewBag.ReportViewName, this one view can be used to launch all my report pages.
    @{
        ViewBag.Title = ViewBag.Title ?? "Reports";
    }
    <link href="@Url.Content("~/Content/TelerikReportingFix.css")" rel="stylesheet" type="text/css" />
     
    <h2>@ViewBag.Title</h2>
     
    @Html.Partial((string)ViewBag.ReportViewName)

    My demo report that launches the viewer (with an objectdatasource object as the data source), in MyDemoReportASPX.aspx
    <%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>
     
    <%@ Register Assembly="Telerik.ReportViewer.WebForms, Version=6.1.12.611, Culture=neutral, PublicKeyToken=a9d7983dfcc261be" Namespace="Telerik.ReportViewer.WebForms" TagPrefix="telerik" %>
     
    <!DOCTYPE html>
    <script runat="server">
     
    </script>
    <html>
    <head runat="server">
        <title>My Demo Report ASPX</title>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
             
            <telerik:ReportViewer ID="MyDemoReportViewer" runat="server" Width="100%" Height="520px">
            <typereportsource
                        typename="MyProject.Reports.MyDemoReport, MyProject, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null"></typereportsource>
            </telerik:ReportViewer>       
        </div>
     
        </form>
    </body>
    </html>

    The Error:
    This was the tricky part. I placed my partial views for the reports in a subfolder named Partials in my Reports view folder. I was getting errors like:
    The view 'MyDemoReportASPX' or its master was not found or no view engine supports the searched locations. The following locations were searched:
    ~/Views/Reports/EQMAgingReportASPX.aspx
    ~/Views/Reports/EQMAgingReportASPX.ascx
    ~/Views/Shared/EQMAgingReportASPX.aspx
    ~/Views/Shared/EQMAgingReportASPX.ascx
    ~/Views/Reports/EQMAgingReportASPX.cshtml
    ~/Views/Reports/EQMAgingReportASPX.vbhtml
    ~/Views/Shared/EQMAgingReportASPX.cshtml
    ~/Views/Shared/EQMAgingReportASPX.vbhtml
    ~/Views/Reports/Partials/EQMAgingReportASPX.cshtml

    Or the maddeningly cryptic:
    'System.Web.Mvc.ViewPage' is not allowed here because it does not extend class 'System.Web.Mvc.WebViewPage'.

    The Fix:
    Because I was using a custom "partials" location, my default view engine (Razor) didn't know where to look for it. Notice it didn't search ~/Views/Reports/Partials/. I had the custom location defined for .cshtml pages, but the ASPX (WebForms) engine had to be configured, too. Here is my new CustomViewEngine.cs:
    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.Mvc;
     
    // My custom view engine.
    namespace MyProject
    {
        public class MyRazorViewEngine : RazorViewEngine
        {
            public MyRazorViewEngine()
            {
                // Serve view files named ~/Views/{controller}/Partials/{action}.cshtml.
                this.PartialViewLocationFormats = new[] {
                    "~/Views/{1}/Partials/{0}.cshtml"
                };
            }
        }
     
        public class MyAspxViewEngine : WebFormViewEngine
        {
            public MyAspxViewEngine()
            {
                // Serve ASPX views from custom locations.
                this.PartialViewLocationFormats = new[] {
                    "~/Views/{1}/Partials/{0}.aspx"
                };
            }
        }
    }

    After verifying the following lines were added to the Application_Start() method in Global.Asax.cs:
    protected void Application_Start()
    {
        // ...
     
        // Tell view engines to look in custom locations.
        ViewEngines.Engines.Add(new MyRazorViewEngine());
        ViewEngines.Engines.Add(new MyAspxViewEngine());
     
        // ...
    }

    Now, when ~/Views/Reports/ReportView.cshtml looked for ~/Views/Reports/Partials/MyDemoReportASPX.aspx, it found the view in the Reports/Partials subfolder, used the ASPX engine, and did not throw the exceptions when rendering the partial view to launch the report viewer.

Back to Top