Display Data in Report Viewer with MVC 4

Here you will find the steps:

Step 1

Below, you will find the table used in the application.



After creating the table, you can fill it using, for example, the data rows as shown below:



Step 2

Open Visual Studio, and Add New Project.





Step 3

Add Report file (.rdlc).

Now, you need to add a report file (.rdlc). Right click on project name and then Add> Add New Item > Reporting > Report > Add.



In this part, we need to configure our Report View with the fields which you want to add in the report. In this case, I chose to add all fields of my table.



Step 4

Configuring Dataset.

Here, we need to repeat the following steps for getting the same result.











After finishing the steps shown below, we will pass to the next step.

Step 5

Add Entity Data Model.

Right click on project name from solution explorer, then Add > New Item > Select ADO.Net Entity Data Model > Add.









Step 6

Add a View with .Aspx extension into the shared Folder.

Right Click on shared folder > Add > New Item >View Page (ASPX).

Step 7

You will add Report Viewer and Script Manager Controls from ToolBoxpanel as shown below.



Now, write the code between the head tag as follow.

<headrunat="server">
<metaname="viewport"content="width=device-width"/>
<title> Data Report With MVC 4</title>

   <scriptrunat="server">

      void Page_Load(object sender, EventArgs e)
      {

         if (!IsPostBack)
         {

            List<ReportViewerMVC.Customers> customers = null;

            using (ReportViewerMVC.EntityFrameworkTestEntities _entities = new ReportViewerMVC.EntityFrameworkTestEntities())
            {

               customers = _entities.Customers.ToList();

               ReportViewer1.LocalReport.ReportPath = Server.MapPath("~/Report/MyReport.rdlc");


               ReportDataSource RDS = newReportDataSource("DataSet1", customers);

               ReportViewer1.LocalReport.DataSources.Add(RDS);

               ReportViewer1.LocalReport.Refresh();

            }

         }
      }


   </script>

</head>

Step 8

Add New Controller.

Right click on the Controllers folder > Add > Controller > Enter Controller name (“Customers”) > Add. By default we have index action as follows.

publicclassCustomersController: Controller
{
    //
    // GET: /Customers/
    publicActionResult Index()
    {
        return View();
    }
}

Step 9

Add view related to Index Action.

At this level, we need to click on form action > Add View > Enter View name (Index)> Add.

Index.cshtml

@{
   ViewBag.Title = "Display Data in the Report Viewer";
}

<h2>Display Data in the Report Viewer</h2>

@* Here we call the page that I have been created into shared folder *@

@Html.Partial("DataReport")

Step 10

Run Application.