[Tips]Crear PDF con ASP.NET MVC y RazorPDF

Hola, hace poco escribí un articulo sobre una consulta recurrente de como crear PDF en ASP.NET, y es que es algo que utilizamos bastante en el día día. Ahora es la oportunidad de MVC, ya que también llegan varias preguntas de ello. Para esto vamos a utilizar un package de Nuget que se llama RazorPDF, que internamente utilizada iTextSharp, puedes ver documentación de esta librería acá: https://www.nuget.org/packages/RazorPDF

Ahora veamos un ejemplo simple paso a paso, relacionado con el ejemplo del articulo anterior, la idea es generar lo mismo, pero ahora con MVC, asi que vamos por parte.

Primero vamos a crear el proyecto MVC, voy a crear una aplicación básica:

image

Luego instalamos el paquete Nuget:

image

Si todo salió bien, veremos que se instalaron todas las dependencias:

image

La vista

image

 

Esta vista la he creado con el siguiente código, como no estoy usando un modelo tipado, no voy a utilizar los helpers para ese propósito, así que simplemente es un formulario, en donde indico cuales son los campos:

@{

    Layout = "~/Views/Shared/_Layout.cshtml";

}

<!DOCTYPE html>

<html>

<head>

    <title>RazorPDF Demo </title>

</head>

<body>

    <h2>Ejemplo de creación de PDF con RazorPDF </h2>

    <div>

        @using (Html.BeginForm("Ejemplo", "PDF",

           FormMethod.Post, new { id = "formulario" }))

        {

            <p>

                <label for="tx_nombre">Nombre</label>

                <input type="text" id="tx_nombre" name="tx_nombre" required />

            </p>

            <p>

                <label for="tx_apellido">Apellido</label>

                <input type="text" id="tx_apellido" name="tx_apellido" required />

            </p>

            <p>

                <label for="tx_edad">Edad</label>

                <input type="number" id="tx_edad" name="tx_edad" required />

            </p>

            <input type="submit" value="Generar PDF" />

          

        }

    </div>

</body>

</html>

El controlador

Ahora veremos el código, vamos a crear un controlador que se llame PDFController:

public class PDFController : Controller

{

   public ActionResult Index()

   {

      return View();

   }

    

[AcceptVerbs("POST")]

public object Ejemplo(string tx_nombre, string tx_apellido, string tx_edad)

  {

    var pdf = new RazorPDF.PdfResult(null, "EjemploPdf");

    pdf.ViewBag.Title = "Titulo del Reporte";

    pdf.ViewBag.Nombre = tx_nombre;

    pdf.ViewBag.Apellido = tx_apellido;

    pdf.ViewBag.Edad = tx_edad;

    return pdf;

  }

}

 

Como puedes ver, tenemos un controlador que recibe desde un formulario (POST) un parámetro nombre, apellido y edad, esto lo hice para que tengas la guía de cuando quieras crear un informe en pdf con parámetros de búsqueda. Se instancia un objeto PdfResult, el primero parámetro es el objeto que puedes pasarle como argumento como no estoy utilizando ninguna, queda en null, el segundo parámetro es el nombre de la vista que tiene el informe. Además Le asigno al viewbag de este PdfResult para luego mostrarlo en el informe y se retorna el objeto pdf.

Ahora corresponde revisar la vista EjemploPDF, que va  a contener la estructura del informe PDF.

Archivo EjeploPdf

Este código XML define la estructura del PDF a generar, como vez, agrego los datos desde el controlador mediante el objeto ViewBag, además podemos setear la fuente y agregar una imagen:

 

<itext creationdate="@DateTime.Now.ToString()" producer="RazorPDF">

<paragraph style="font-family: Helvetica; font-size: 18; font-style: italic;">

       <chunk red="255" green="0" blue="0">@ViewBag.Title</chunk>

</paragraph>

<paragraph>

    <chunk style="font-family:Times;font-weight:bold;">Fecha Reporte: </chunk>

    <chunk style="font-family:Times;">@DateTime.Now.ToString("MM/dd/yyyy")</chunk>

</paragraph>

<paragraph>

    <chunk style="font-family:Times;font-weight:bold;">Nombre: </chunk>

    <chunk style="font-family:Times;">@ViewBag.Nombre</chunk>

</paragraph>

<paragraph>

    <chunk style="font-family:Times;font-weight:bold;">Apellido: </chunk>

    <chunk style="font-family:Times;">@ViewBag.Apellido</chunk>

</paragraph>

<paragraph>

    <chunk style="font-family:Times;font-weight:bold;">Edad: </chunk>

    <chunk style="font-family:Times;">@ViewBag.Edad</chunk>

</paragraph>

<newline />

<image url="@Context.Server.MapPath("~/Content/imagen.jpg")"/>

<paragraph style="font-family: Helvetica; font-size: 18; font-style: italic;">

       <chunk red="255" green="0" blue="0">By @@Chalalo</chunk>

</paragraph>

</itext>

Ahora al momento de ejecutarlo, ingresar datos al formulario y luego presionar sobre el botón “Genera PDF”, logramos el siguiente PDF.

image

Como puedes ver, bastante sencillo y útil.
Nos vemos en un próximo post!
Saludos,
@chalalo

[WebCast] ASP.NET Desarrollo para móviles y Tablet’s

Hola!, te quería invitar a este nuevo evento (de todas maneras lo voy a grabar y a publicar), pero no hay como verlo en vivo, ya que podemos hacer consultas, establecer discusión, etc.

El tráfico móvil en la web está explotando. ¿Estás listo? Microsoft ASP.NET MVC 4 incluye nuevas plantillas para dispositivos móviles, un enfoque en el diseño de response desing El orador muestra lo que puedes hacer hoy y mañana para hacer su sitio amigable en un dispositivo móvil. ¿Cuándo debería su sitio móvil convertido en una aplicación móvil? ¿Debe usar CSS3 media querys?, o ir "all in" y el uso de jQuery móvil u otro marco móvil?

Fecha: 27/06/2013 (dd/mm/yyyy).
Hora: 04:00 PM (GMT-05:00 Colombia, Panamá).
Si tiene dudas con la conversión de zonas horarias, por favor haga clic aquí

Inscríbete acá:
https://msevents.microsoft.com/CUI/EventDetail.aspx?EventID=1032551084&Culture=es-AR&community=0

image

Material de Charla– Utilizando IE10 para Windows 8 y para WP8

image Hola, hace poco tuve que dar la charla de desarrollo web enfocado a Internet Explorer 10 e Internet Explorer 10 para Windows Phone, agradezco a todos los que fueron. Les dejo las Slides y el material que fue proporcionado y por el gran Jorge Peraza, puedes ver su presentación (en la cual basé parte de la mía) acá:
http://channel9.msdn.com/Events/Build/2012/2-015

Acá están mis slides:

y puedes descargar desde acá los códigos que revisamos sobre

  • Preparar los sitios para Windows 8 (pinned sites, budget, asociar a la tienda, habilitar “compartir”
  • Ejemplos de HTML5 (De Jorge Peraza)
  • Los códigos cool del desarrollo de HTML5 apps para Windows Phone e IE10.

DESCARGA
https://dl.dropboxusercontent.com/u/1303802/IE10Test.zip

Voy a escribir en unos próximos post, en detalle el tema de como preparar nuestros sitios para aprovechar las ventajas de Windows 8.

Muchas gracias por los buenos comentarios de la charla Sonrisa, lo pasamos bastaste bien.

Nos vemos!!!
Saludos!

Invitación a Evento– Las potencialidades de IE10

Hola!, los quería invitar al siguiente evento en el que vamos a hablar de las potencialidades de Internet Explorer 10 SonrisaSortearemos una Xbox 360 entre los asistentes!!!

image

El link de registro es el siguiente!, aprovecha esta oportunidad! Sonrisa, nos vemos allá!!

https://msevents.microsoft.com/CUI/EventDetail.aspx?EventID=1032555640&Culture=es-CL&community=0

Saludos!!
@chalalo

Comenzando con ASP.NET Web API y Odata , Parte 3

Hola que tal?, seguimos con esta serie de artículos sobre Web Api y Odata, esta vez veremos las opciones de consulta.

Una de las potencialidades de Odata es la capacidad de definir consultas personalizadas y parametrizadas mediante la url, siguiendo nuestros ejemplos anteriores, podemos tener:

http://localhost:1927/Odata/Asignaturas?$orderby=Semestre

A estos parámetros Odata les llamara “query Options”, dentro de las que nos ofrece Odata tenemos:

  • $filter: Filtra los resultados, basados en una condición booleana.
  • $inlinecount: Le indica al servidor que incluya dentro del resultado el total de entidades que se obtuvieron por medio de la query, eso está pensado en la páginación eficiente del lado del servidor
  • $orderby: Ordena los resultado por algún criterio establecido en la query.
  • $skip: omite los primeros n resultados, apropiado para la paginación.
  • $top: Retorna solo los primeros n resultados.

Antes que nada, debemos habilitar la posibilidad de utilizar estas Query Options, y se debe hacer explícitamente, así que nos vamos al método Register del archivo WebApiConfig y des comentamos la línea que dice : config.EnableQuerySopport();

image

Si no te aparece esto, es por que debes instalar el WebTools 2012.2 Update, ya que la plantilla  Web API incluye este código.

Algo importante de indicar,  es que el método  EnableQuerySupport habilita las consultas para todos las acciones de los controladores que retornen un tipo IQueryable. Si no quieres que esto suceda, y solo agregar esta característica a algunas acciones, debes agregar el atributo [Queryable] a cada acción:

[Queryable]

public override IQueryable<Asignatura> Get()

{

   return asignaturas.AsQueryable();

}

Veamos entonces algunos ejemplos de consultas, si recordamos el artículo anterior teníamos:

http://localhost:1927/Odata/Asignaturas/

image

Para los filtros tenemos:

Retorna todos las asignaturas con semestre igual a 2:

http://localhost:1927/Odata/Asignaturas?$filter=Semestre eq 2

image

Retorna todas las asignaturas que tienen el string II dentro de Nombre:

http://localhost:1927/Odata/Asignaturas?$filter=substringof(‘II’,Nombre)

image

La misma consulta anterior, pero con el retorno de la cantidad de resultados:

http://localhost:1927/Odata/Asignaturas?$filter=substringof(‘II’,Nombre)&$inlinecount=allpages

image

El mismo ejemplo anterior, le agregamos ordenación descendente por ID

http://localhost:1927/Odata/Asignaturas?$filter=substringof(‘II’,Nombre)&$inlinecount=allpages&$orderby=ID desc

image

Como vez, bastante útil y fácil, en el próximo articulo revisaremos el tema de la paginación con un completo ejemplo, nos vemos!

@chalalo.