ReportViewer y ASP NET MVC

Vista previa del material en texto

Docente: 
M.A. Alex Pacheco Moya 
ReportViewer y ASP.NET MVC 
CONTENIDO 
REPORTVIEWER y 
ASP.NET 
• Proyecto MVC 
• Base de Datos 
• Report RDLC 
 
 
 
 
S15 
 
 
M.A. Alex Pacheco Pagina #2 
Instituto de Educación Superior Privado El Buen Pastor 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
ReportViewer y ASP.NET MVC 
 
 
 
M.A. Alex Pacheco Pagina #3 
Instituto de Educación Superior Privado El Buen Pastor 
• Cree y muestre el informe SSRS en ASP.NET MVC 
(Ejemplo con código) 
 
 
1. Cree un nuevo proyecto en su Visual Studio (Archivo-> Nuevo-> Proyecto-
> Desde web (panel izquierdo) -> Seleccione "Proyecto web Asp.Net" (panel 
derecho)). 
 
 a) Ingrese un nombre, haga clic en "Aceptar" 
 b) Seleccione la plantilla "MVC" del proyecto y haga clic en "Aceptar" 
 
2. En su nuevo proyecto, instale estos paquetes para Report Viewer, usando 
el administrador de paquetes Nuget (para la consola del administrador de 
paquetes Nuget, busque Herramientas-> Administrador de paquetes Nuget-> 
Consola del administrador de paquetes Nuget), luego ingrese estos 
comandos: 
 
 
Install-Package Microsoft.Report.Viewer -Version 11.0.0 
 
Install-Package Microsoft.ReportViewer.Runtime.WebForms -Version 12.0.2402.15 
 
 Install-Package ReportViewerForMvc 
 
 
 
Nota: Al instalar ReportViewForMVC, el paquete nuget debe haber agregado 
un nuevo archivo "ReportViewerWebForm.aspx", lo mantendremos igual y no 
cambiaremos nada en él. 
 
 
Base de datos 
 
 
 
 
 
 
 
M.A. Alex Pacheco Pagina #4 
Instituto de Educación Superior Privado El Buen Pastor 
 
El código de la BD Students se da en el script. 
 
 
3.Agregue una nueva carpeta llamada - "Report" en su proyecto y siga estos 
pasos: 
 Haga clic derecho en la carpeta -> Seleccione "Add" -> Agregar nuevo 
elemento "DataSet" - nómbrelo correctamente 
Ahora debe ver el explorador del servidor, haga clic en él y agregue una nueva 
conexión para conectarse a su base de datos, como se muestra a 
continuación. 
 
 
 
 
Configure para conectarse a su base de datos, y luego simplemente arrastre 
y suelte su tabla de base de datos/procedimiento almacenado, y verá un 
resultado como el siguiente 
 
 
 
 
 
M.A. Alex Pacheco Pagina #5 
Instituto de Educación Superior Privado El Buen Pastor 
 
Right Click on "reports" folder -> add new item - go to reporting - > select 
"report" option -> name it properly -> Click "OK" 
 
 
 
Nota: Si no puede encontrar Informes en sus plantillas de Visual Studio, es 
posible que deba instalarlo primero. Puede instalarlo navegando 
 
"tools"-> Select "Extension and Updates" -> Search "Report" ->Click on Install 
for "Microsoft reporting services projects" and "Microsoft RDLC report 
Designer for Visual Studio" both -> Close Visual Studio 
 
se iniciará y luego Reiniciar VS ahora, debe ver la opción. 
 
Ahora abra Report1.rdlc, del "report data" tab select "Data sets", si no hay 
nada right click and add Data-set. 
 
 
 
 
M.A. Alex Pacheco Pagina #6 
Instituto de Educación Superior Privado El Buen Pastor 
 
Una vez que seleccione el conjunto de datos, arrastre y suelte la columna en 
report1.rdlc (Nota: la imagen de arriba muestra columnas diferentes a las de 
la base de datos utilizada en el ejemplo). 
 
add/select other columns 
 
(que necesita), que se mostrarán en el informe. 
 
4. Navegue a HomeController.cs y use el siguiente código (si no hay un 
controlador, haga clic con el botón derecho en la carpeta 
-> Select "Add"-> Select "Controler"> Select MVC 5 Controller – Empty > click 
Add) 
 
El código fuente de C# para el controlador sería el siguiente: 
 
 
 
using Microsoft.Reporting.WebForms; 
using System.Configuration; 
using System.Data.SqlClient; 
using System.Web.Mvc; 
using System.Web.UI.WebControls; 
 
namespace SSRSInMVC.Controllers 
{ 
 public class HomeController : Controller 
 { 
 public ActionResult Index() 
 { 
 
 
 return View(); 
 } 
 
 
 SSRSInMVC.Report.Report ds = new 
SSRSInMVC.Report.Report(); 
 public ActionResult ReportStudent() 
 { 
 ReportViewer reportViewer = new ReportViewer(); 
 reportViewer.ProcessingMode = ProcessingMode.Local; 
 reportViewer.SizeToReportContent = true; 
 reportViewer.Width = Unit.Percentage(900); 
 reportViewer.Height = Unit.Percentage(900); 
 
 
 
M.A. Alex Pacheco Pagina #7 
Instituto de Educación Superior Privado El Buen Pastor 
 var connectionString = 
ConfigurationManager.ConnectionStrings["SSRSInMVC.Properties.
Settings.StudentsConnectionString"].ConnectionString; 
 
 
 SqlConnection conx = new SqlConnection(connectionString); 
 SqlDataAdapter adp = new SqlDataAdapter("SELECT * 
FROM Student_details", conx); 
 
 adp.Fill(ds, ds.Student_details.TableName); 
 
 reportViewer.LocalReport.ReportPath = 
Request.MapPath(Request.ApplicationPath) + 
@"Report\Report1.rdlc"; 
 reportViewer.LocalReport.DataSources.Add(new 
ReportDataSource("DataSet1", ds.Tables[0])); 
 
 
 ViewBag.ReportViewer = reportViewer; 
 
 return View(); 
 } 
 } 
} 
 
 
Explicación del código anterior: en el código anterior estamos obteniendo 
valores de la base de datos, cargue la URL en la vista de informe usando el 
código 
 
 
 
reportViewer.LocalReport.ReportPath = 
Request.MapPath(Request.ApplicationPath) + 
@"Report\Report1.rdlc"; 
 reportViewer.LocalReport.DataSources.Add(new 
 ReportDataSource("DataSet1", ds.Tables[0])); 
 
 
5. Add View ReportStudent.cshtml, with the following source 
 
 
 
 
 
 
 
M.A. Alex Pacheco Pagina #8 
Instituto de Educación Superior Privado El Buen Pastor 
 
 
@using ReportViewerForMvc; 
@{ 
 ViewBag.Title = "Report Student"; 
} 
<br/> 
<br /> 
 
 @Html.ReportViewer(ViewBag.ReportViewer as 
 Microsoft.Reporting.WebForms.ReportViewer) 
 
 
Como puede ver en el código anterior, hacemos referencia a 
ReportViewerForMVC en la vista anterior, con la ayuda de la cual estamos 
generando informes en nuestra vista. 
 
6. Ya hemos terminado, puede ejecutar el proyecto en su navegador, navegar 
a "/Home/ReportStudent" y obtendrá el resultado según sea necesario, aquí 
está el resultado 
 
 
 
 
Note: If you are getting only first value from your database table, Go to 
"report1.rdlc" -> Right Click any column "Expr" -> Select "Expression" -> Change 
"First(Fields!ColumName.Value,"DataSet1")" to "Fields!ColumName.Value". 
 
 
 
M.A. Alex Pacheco Pagina #9 
Instituto de Educación Superior Privado El Buen Pastor 
 
Si desea abrir el informe en una pestaña nueva, en lugar de mostrarlo en la 
vista, simplemente agregue un enlace de anclaje en la vista 
 
 
 
@{ 
 ViewBag.Title = "Report Student"; 
} 
<br/> 
<br /> 
 
 <a href="/ReportViewerWebForm.aspx" target="_blank">open report 
 in new tab</a> 
 
 
Se abrirá el informe en una nueva pestaña cuando se haga clic en él, pero no 
he cambiado nada en C# Controller ActionMethod "ReportStudent", lo 
mantendremos igual. 
 
 
 
 
 
Referencia: 
 
Create and display SSRS Report in ASP.NET MVC (Example with code) 
Posted By :- SnehalSawant 
 
https://qawithexperts.com/article/asp.net/displaying-ssrs-sql-server-reporting-service-in-
mvc-view/77 
 
 
 
https://qawithexperts.com/article/asp.net/displaying-ssrs-sql-server-reporting-service-in-mvc-view/77
https://qawithexperts.com/article/asp.net/displaying-ssrs-sql-server-reporting-service-in-mvc-view/77