How to use Microsoft Report in MVC 4 With Image Fields form database.

Introduction

In this post (Part 2), I explain how to use Microsoft Report in MVC 4 With Image Fields from a database.

In Part 1 I have explained how to use Microsoft Report in MVC 4. But some viewer commented how to do the same with image data from a database.

Prerequisite

I used followings:
  • .Net framework 4.0
  • Entity Framework
  • Sql Server 2008

Steps :

Just follow the steps and get result easily.

Step - 1 : Create New Project

Go to File > New > Project > Select asp.net mvc4 web application > Entry Application Name > Click OK.

Step-2: Add a Database.

Go to Solution Explorer > Right Click on App_Data folder > Add > New item > Select SQL Server Database Under Data > Enter Database name > Add.

Step-3: Create table and insert data for show in report

Open Database > Right Click on Table > Add New Table > Add Columns > Save > Enter table name > Ok.

Here my database table




Step-4: Add Entity Data Model.

Go to Solution Explorer > Right Click on Project name form Solution Explorer > Add > New item > Select ADO.net Entity Data Model under data > Enter model name > Add.
A popup window will come (Entity Data Model Wizard) > Select Generate from database > Next >
Chose your data connection > select your database > next > Select tables > enter Model Namespace > Finish.

Step-5: Add Action for populate data.

Go To Controller > Add your action > write following code and Rebuild your application to get data from Database.
                   

public ActionResult StateArea()
        {
            using (PopulationEntities dc =      new PopulationEntities())
            {
                var v = dc.StateAreas.ToList();
                return View(v);
            }
        }

Step-6: Add View for show data on page.

Right Click on your Action > Add View > Enter View name > Check Create a strongly-type view > Select your model class > Select Scaffold templete > Select list > Add.

View


@model IEnumerable<MvcReportViwerApp.StateArea>
@{
    ViewBag.Title = "State Area";
}
<h2>State Area - Report</h2>

<table>
    <tr>
        <th> State ID</th>
        <th>State Name</th>
        <th>Area(KM)</th>
        <th></th>
    </tr>
@foreach (var item in Model) {
    <tr>
        <td>@Html.DisplayFor(modelItem => item.StateID)</td>
        <td>@Html.DisplayFor(modelItem => item.Statename)</td>
        <td>@Html.DisplayFor(modelItem => item.Area)</td>
        <td>
            @if (item.StateImage != null)
            {
                string base64String = "data:image/png;base64,"+Convert.ToBase64String(item.StateImage, 0, item.StateImage.Length);
                <img src="@base64String" width="100px" />;
            }                       

        </td>
    </tr>
}
</table>
<div style="padding:10px; border:1px solid black">
    <div><a href="@Url.Action("Report",new {id= "PDF"})"> Get Report PDF</a></div>
    <div><a href="@Url.Action("Report",new {id= "Excel"})"> Get Report Excel</a></div>
    <div><a href="@Url.Action("Report",new {id= "Word"})"> Get Report Word</a></div>
    <div><a href="@Url.Action("Report",new {id= "Image"})"> Get Report Image</a></div>
</div>


 
Run Application.

Look Result show in your browser.
Now Add some links to your view for generate PDF,Excel,Word files containing report data. Add this to your view.

Step-7: Add Reference (Microsoft.ReportViwer.WebForms.dll)

Right Click on references under project folder > Add Reference > Select Microsoft.ReportViwer.WebForms.dll > OK.

Step-8: Add Report file(.rdlc) and Design your report.

Add report folder to your project
Right Click on report folder > Add > New item > Select Report under Reporing > Enter report file name > Add.
Here we also have to add Datasource for our report.
Under report data Click on New > Dataset > New > Choose Data Connection > Next > Select Table > Finish.
Now Design your Report looks.

Step-9: Add Action for generate PDF, Excel, Word and Image File for Report Data

Right Click on your Action > Add View > Enter View name > Check Create a strongly-type view > Select your model class > Select Scaffold templete > Select list > Add. Go To Controller > Add your action > write following code and Rebuild your application to get data from Database.
                        
    

public ActionResult Report(string id)
        {
            LocalReport lr = new LocalReport();
            string path = Path.Combine(Server.MapPath("~/Report"), "ReportStateArea.rdlc");
            if (System.IO.File.Exists(path))
            {
                lr.ReportPath = path;
            }
            else
            {
                return View("Index");
            }
            List<StateArea> cm = new List<StateArea>();
            using (PopulationEntities dc = new PopulationEntities())
            {
                cm = dc.StateAreas.ToList();
            }
            ReportDataSource rd = new ReportDataSource("MyDataset", cm);
            lr.DataSources.Add(rd);
            string reportType = id;
            string mimeType;
            string encoding;
            string fileNameExtension;



            string deviceInfo =

            "<DeviceInfo>" +
            "  <OutputFormat>" + id + "</OutputFormat>" +
            "  <PageWidth>8.5in</PageWidth>" +
            "  <PageHeight>11in</PageHeight>" +
            "  <MarginTop>0.5in</MarginTop>" +
            "  <MarginLeft>1in</MarginLeft>" +
            "  <MarginRight>1in</MarginRight>" +
            "  <MarginBottom>0.5in</MarginBottom>" +
            "</DeviceInfo>";

            Warning[] warnings;
            string[] streams;
            byte[] renderedBytes;

            renderedBytes = lr.Render(
                reportType,
                deviceInfo,
                out mimeType,
                out encoding,
                out fileNameExtension,
                out streams,
                out warnings);


            return File(renderedBytes, mimeType);
        }

Step-10: Run Application

Click on links and get your report in PDF, Excel, Word and Image format.


Hello ! My name is Sourav Mondal. I am a software developer working in Microsoft .NET technologies since 2010.

I like to share my working experience, research and knowledge through my site.

I love developing applications in Microsoft Technologies including Asp.Net webforms, mvc, winforms, c#.net, sql server, entity framework, Ajax, Jquery, web api, web service and more.