Saltar al contenido

Artículos, tutoriales, trucos, curiosidades, reflexiones y links sobre programación web ASP.NET Core, MVC, Blazor, SignalR, Entity Framework, C#, Azure, Javascript... y lo que venga ;)

17 años online

el blog de José M. Aguilar

Inicio El autor Contactar

Artículos, tutoriales, trucos, curiosidades, reflexiones y links sobre programación web
ASP.NET Core, MVC, Blazor, SignalR, Entity Framework, C#, Azure, Javascript...

¡Microsoft MVP!
miércoles, 16 de febrero de 2011
ASP.NET MVCHace unos días hablaba de ObjectInfo y ServerInfo, dos helpers presentes en System.Web.Helpers, un componente compartido por ASP.NET MVC 3 y WebPages. Hoy vamos a revisar la clase estática Json, también definida en dicho espacio de nombres, que podemos utilizar para codificar objetos en formato JSON (JavaScript Object Notation) y viceversa, crear instancias de objetos partiendo de un texto JSON.

El primero de los sentidos, CLR—>JSON, no es algo que no pudiéramos hacer antes utilizando los serializadores Javascript, pero este componente nos lo pone algo más fácil. Por ejemplo, dada la siguiente clase del Modelo:

Clase del Modelo
… y un controlador en el que suministramos a la vista una instancia de dicha clase:

Código del Controlador

En la Vista podríamos introducir un código como el siguiente para volcar sobre la salida la representación JSON del objeto del modelo. Observad que hasta ahora para conseguir lo mismo teníamos que escribir bastante más código:

Código de la Vista

Fijaos también que el resultado de Json.Encode (bueno, y la alternativa anterior también), debemos pasarlo por una llamada a Html.Raw() para evitar que sea codificado a HTML antes de enviarlo al cliente. En cualquier caso, el resultado puede ser asignado directamente a una variable, puesto que el marcado generado es la representación JSON del objeto suministrado listo para su uso, como puede observarse en  el resultado de procesar la vista anterior:

Código generado

Por otra parte, también podemos utilizar la clase Json para hacer la conversión inversa, es decir, construir un objeto del CLR desde un string que representa un objeto codificado en JSON. Como en el caso anterior, también podíamos utilizar JavascriptSerializer para conseguirlo, pero ahora podemos hacerlo más rápidamente:

Deserialización JSON a objeto

Publicado en: Variable not found.
martes, 15 de febrero de 2011
ASP.NET MVCEn posts anteriores hemos hablado sobre el helper WebGrid (aquí y aquí), y las facilidades que nos ofrece a la hora de crear rejillas de datos con paginación y ordenación. En todos los ejemplos que vimos, cada cambio de página o de criterio de ordenación forzaba una recarga completa de la vista, lo cual es bastante correcto y válido en la mayoría de escenarios.

Sin embargo, WebGrid también ofrece la posibilidad de recargar (al menos visualmente, como veremos después) únicamente la rejilla de datos, por lo que se consigue un comportamiento muy al estilo Ajax, como el que podemos conseguir con otras soluciones. Y de nuevo de forma realmente sencilla, en dos simples pasos.

En primer lugar, en la instanciación del objeto WebGrid, debemos suministrar un valor al parámetro  ajaxUpdateContainerId, indicando el identificador del elemento en cuyo interior generaremos la rejilla de datos, por ejemplo así:
    WebGrid grid = new WebGrid(
        ..., // Otros parámetros del constructor
        ajaxUpdateContainerId: "contenedor-grid"
    );

Y finalmente, ya dentro del marcado de la vista, debemos asegurar que la llamada a GetHtml() del helper se realice dentro de un contenedor con el identificador especificado anteriormente:

<div id="contenedor-grid">
@grid.GetHtml(
    fillEmptyRows: true,
    alternatingRowStyle: "fila-alternativa",
    headerStyle: "encabezado-grid",
    footerStyle: "pie-grid",
    mode: WebGridPagerModes.All,
    ...
})
</div
>

Y eso es todo. Sin necesidad de modificar el Controlador, ni por supuesto el Modelo, las operaciones de desplazamiento entre páginas, cambio de columna o sentido de ordenación, no recargarán la página completa, sino únicamente el contenedor indicado.

Parece magia, eh? ;-)

Tras bambalinas

Pues no, no hay nada mágico, lo que está ocurriendo por detrás es bastante simple: al activarse el modo Ajax, simplemente por el hecho de asignar un valor a ajaxUpdateContainerId, WebGrid modificará la forma de generar los enlaces del paginador y las columnas ordenables, de forma que no guiarán al navegador hacia la acción de refresco, sino ejecutarán un script.

En este script se utiliza el método load() de jQuery para solicitar de forma asíncrona la página completa, invocando la misma acción actual, y suministrándole los parámetros que necesita, o sea, la página actual, orden o sentido de ordenación, dependiendo de la operación realizada.

Del resultado de esta petición Ajax (la página completa de nuevo), jQuery seleccionará sólo el fragmento cuyo identificador coincida con el indicado por ajaxUpdateContainerId, y sustituirá el contenido del elemento con ese mismo identificador en la vista actual.

De esa forma, se habrá actualizado el grid sin necesidad de recargar visualmente la página completa, aunque internamente sí se habrá generado y enviado al cliente completa. La verdad, esta forma de conseguir el efecto Ajax, un poco a lo bestia, recuerda un poco al celebérrimo UpdatePanel :-O.

Y ya puestos a criticar (constructivamente siempre, claro ;-)), seguro que podría haberse conseguido una implementación no intrusiva, de forma que un usuario con los scripts desactivados obtuviese el funcionamiento “por defecto” del Grid, con recarga total de la página.

Pero bueno, al menos es interesante saber que WebGrid cuenta con la posibilidad de ajaxificarse, y conocer el funcionamiento de esta característica, por si en alguna ocasión nos encontramos con ella.

Dejo en SkyDrive un proyecto de demostración de WebGrid en modo Ajax (VS2010+MVC3+SQLExpress), así como los ejemplos de los post anteriores sobre el mismo tema, por si os interesa verlo en funcionamiento.



Publicado en: Variable not found.
domingo, 13 de febrero de 2011
Estos son los enlaces publicados en Variable not found en Facebook y Twitter desde el domingo, 06 de febrero de 2011 hasta el domingo, 13 de febrero de 2011.

Espero que te resulten interesantes. :-)
Y no olvides que puedes seguir esta información en vivo y en directo desde Variable not found en Facebook, o a través de Twitter.

Publicado en: Variable not found
miércoles, 9 de febrero de 2011
Todo el mundo ha oído hablar de ellos… todo el mundo conoce a alguien que los vio una vez… creer en su existencia es a veces sólo cuestión de fe… y sólo algunos privilegiados han podido verlos en persona… Está claro que hablo de los cheques de AdSense, ¿no? :-D

Pues nada, que estoy que no quepo en mí de gozo y quería compartirlo (el gozo, no el cheque ;-D) con todos vosotros, los que hacéis posibles estos milagros. Resulta que hace unos días recibí una carta de Irlanda, en la que venía un regalito como este:

Peaso de cheque

Hace unos cuatro años que coloqué, por probar, AdSense en el blog. Nunca pensé lo grande que sería la alegría que da recibir uno de estos con tu nombre y con una cantidad que jamás soñé que podría conseguir.

Supongo que esto responde a la eterna pregunta “y tú, ¿por qué escribes en tu blog?”:
- Pues por dinero, claro, ¿por qué iba a ser si no?
Publicado en: Variable not found.
lunes, 7 de febrero de 2011
ASP.NET MVCDías atrás comentábamos por aquí cómo utilizar el helper WebGrid de MVC 3 para crear rejillas de datos, partiendo de un ejemplo muy sencillo, apenas un par de líneas de código, e introduciendo sucesivas mejoras hasta llegar a un interfaz bastante aceptable para manejar conjuntos de datos con paginación, ordenación, y columnas personalizadas.

WebGrid, con algo de estilo

Sin embargo, también comentábamos que la pasmosa simplicidad con la que podíamos poner en marcha un grid completo tenía su coste: por defecto, WebGrid necesita disponer de una copia en memoria del conjunto completo de datos sobre el que actúa. Sí, completo :-O.

Es decir, si tenemos un millón de filas de nuestra base de datos y queremos mostrarlas en un orden concreto y por páginas, debemos suministrar a WebGrid una colección con el millón de entidades materializadas en memoria; el helper las ordenará según el criterio activo en ese momento, contará el total de elementos, calculará las páginas necesarias para mostrarlos en función del número de elementos por página definidos, y obtendrá el subconjunto de instancias correspondientes a la página actual. Tras ello, generará el grid y el mecanismo de paginación que podemos ver en su pie.

Obviamente, el impacto en el rendimiento de nuestro sistema puede ser terrible. La materialización de entidades no es un proceso rápido, como tampoco lo es la ordenación en memoria cuando el número de elementos es importante. Y lo peor es que el procedimiento completo se repite para cada petición y usuario conectado, lo que hace que utilizar los mecanismos de paginación y ordenación por defecto no sea una buena idea la mayoría de las veces.

Sin duda es bastante mejor delegar al motor de base de datos las tareas de ordenación y selección de filas, y materializar en memoria sólo las entidades que sean necesarias en la vista actual, es decir, la página de datos visible. ¿Lo hacemos?

1. El Modelo, revisitado

Recordemos que en el post anterior teníamos una clase de servicios del Modelo simplísima, con un único método llamado ObtenerPersonas(), que utilizaba un contexto de objetos de Entity Framework para obtener todas las instancias de la clase Persona almacenadas en la base de datos:
public class ModelServices: IDisposable
{
    private readonly DatosEntities _datos = new DatosEntities();
 
    public IEnumerable<Persona> ObtenerPersonas()
    {
        return _datos.Personas.ToList();
    }
 
    public void Dispose()
    {
        _datos.Dispose();
    }
}
En este caso, dado que pretendemos delegar al Modelo la responsabilidad de paginar y ordenar adecuadamente los datos antes de enviarlos a WebGrid, necesitamos añadirle dos nuevos métodos: ContarPersonas(), y ObtenerPaginaDePersonas().

El primero de ellos, ContarPersonas(), que retornará el número de elementos totales existentes en la base de datos. Ya hemos comentado antes que WebGrid podía obtener este dato simplemente contando el total de elementos presentes en el origen de datos, pero como ahora pretendemos pasarle sólo los datos de la página actual, esta información debemos indicársela expresamente para que pueda construir el mecanismo de paginación correctamente.

El código de este método es bastante simple:
public int ContarPersonas()
{
        return _datos.Personas.Count();
}
Vamos ahora a implementar ObtenerPaginaDePersonas(). Como seguro podréis intuir, su objetivo es retornar el conjunto de instancias de Persona que deben aparecer en una página concreta de datos, teniendo en cuenta el número de elementos por página empleado y el criterio de ordenación actual.

Asumiendo que estamos utilizando LINQ, la obtención de una página concreta de datos es trivial utilizando los operadores Skip() y Take(). La única dificultad con la que podemos encontrarnos es la forma de pasar al Modelo el criterio de ordenación actual, pero, como podemos comprobar a continuación hay muchas formas de conseguirlo, casi tantas como desarrolladores que se enfrenten a ella. Para que os hagáis una idea, veremos dos posibilidades: utilizando expresiones de cadena, y basada en expresiones lambda.

1.1. ObtenerPaginaDePersonas(), magic string edition

Una posibilidad bastante sencilla de implementar consiste en que el Modelo reciba directamente una cadena de caracteres en la que se encuentre la expresión de ordenación utilizada. Si podemos asegurar, además, que esta cadena venga ya escrita en Entity SQL, simplemente tendríamos que insertar la cláusula de ordenación apropiada:
public IEnumerable<Persona> 
  ObtenerPaginaDePersonas(int paginaActual, int personasPorPagina, string criterioOrdenacion)
  {
     if (paginaActual<1) paginaActual = 1;
      return _datos.Personas
        .OrderBy(criterioOrdenacion)
        .Skip((paginaActual - 1) * personasPorPagina)
        .Take(personasPorPagina)
        .ToList();
  }
De esta forma, podemos invocar al Modelo pasándole directamente expresiones como “it.Apellidos DESC”,  “it.FechaNacimiento ASC”, o incluso combinaciones como “it.Apellidos DESC, it.Nombre DESC”, que funcionarán perfectamente. Observad que la sintaxis debe ser eSQL (de ahí el prefijo “it.” que llevan delante las propiedades del objeto actual).

Este enfoque, aunque bastante sencillo y rápido de implementar tiene algunas contraindicaciones. El hecho de escribir estas expresiones en el interior de cadenas de texto hace que éstas sean inmunes a refactorizaciones o comprobaciones en tiempo de compilación, lo que aumenta la probabilidad de aparición de errores difíciles de detectar. Asimismo, estamos confiando ciegamente en que la expresión es eSQL sintáctica y semánticamente correcto, por lo que o bien nos arriesgamos a que reviente en tiempo de ejecución si no introducimos las comprobaciones oportunas, o bien debemos delegar a otro componente (por ejemplo, al Controlador) la responsabilidad de construir siempre expresiones válidas.

1.2. ObtenerPaginaDePersonas(), lambda edition

Si queremos evitar el envío de información en cadenas de texto, podemos seguir el enfoque propuesto por LINQ y utilizar árboles de expresión para trasladar los criterios de ordenación al Modelo.

En este caso, el método del Modelo recibirá, además de la página actual y el número de filas por página, un árbol de expresión que contiene la expresión de ordenación, y un elemento de la enumeración Direccion indicando si debe ordenarse ascendente o descendentemente. El código podría ser como el siguiente:
public IEnumerable<Persona> ObtenerPaginaDePersonas<T>(
           int paginaActual, int personasPorPagina, 
           Expression<Func<Persona,T>> ordenacion, 
           Direccion direccion)
{
    if (paginaActual<1) paginaActual = 1;
    IQueryable<Persona> query = _datos.Personas; 
    if (direccion == Direccion.Ascendente)
        query = query.OrderBy(ordenacion);
    else
        query = query.OrderByDescending(ordenacion);
    return query.Skip((paginaActual - 1) * personasPorPagina)
                .Take(personasPorPagina)
                .ToList();
}
Como se puede observar, se trata de un método genérico para dar cobertura a los distintos tipos de propiedad por los que es posible ordenar, que es el tipo de retorno del árbol de expresión ordenacion.

También se puede ver que se aprovecha de la ejecución diferida de LINQ to SQL para ir especificando de forma sucesiva las distintas cláusulas de la consulta. Ésta no será ejecutada hasta el final, en la llamada al método ToList(), que es cuando realmente se materializarán las instancias de Persona presentes en la página de datos actual.

De esta forma, conseguimos que desde el Controlador podamos obtener la página de datos, por ejemplo, así:
var personas = _services.ObtenerPaginaDePersonas(
                      page, 
                      personasPorPagina, 
                      p=>p.NumeroDeHijos,     // Expresión ordenación
                      Direccion.Descendente   // Ascendente);
Observad que, a diferencia de la técnica que vimos anteriormente, aquí sí que usamos tipado fuerte para indicar la ordenación. Un cambio de nombre de la propiedad NumeroDeHijos, por ejemplo, sería refactorizada correctamente o, cuanto menos, generaría un error en compilación.

Como principal inconveniente, decir que no es tan potente y flexible como la anterior. Por ejemplo, en este caso no podemos indicar de forma inmediata más de una propiedad de ordenación, cosa que antes sí era muy sencillo. Eso sí, en nuestro escenario, dado que vamos a ordenar según columnas independientes del grid, tampoco este aspecto es demasiado importante.

En definitiva, existen gran cantidad de posibilidades para implementar el método del Modelo que retorna las instancias pertenecientes a una página concreta de datos atendiendo a los criterios de ordenación especificados. Aquí hemos visto un par de ellas, pero basta con pararse a pensarlo un rato y fácilmente podremos idear un buen puñado más de soluciones.

Vamos a pasar a estudiar ahora qué cambios debemos realizar en el Controlador para realizar la paginación correcta.

2. El Controlador

Si habéis descargado el ejemplo del post anterior u os habéis peleado un poco con WebGrid, habréis notado que el mantenimiento del estado de la rejilla se realiza propagando entre llamadas una serie de parámetros en el query string que, por defecto, son los siguientes:

Querystring en peticiones generadas por WebGrid
  • page, que indica el número de página actual,
  • sort, la columna por la que estamos ordenando,
  • sortDir, la dirección de ordenación actual, indicada con las constantes “ASC” o “DESC”.
Básicamente se trata de la misma información que debemos suministrar al Modelo, previamente adaptada, para obtener la relación de personas de la página actual, por lo que el primer paso será utilizar la magia del binder para poder obtener estos valores directamente desde nuestra acción del controlador. De hecho, el siguiente podría ser un buen esqueleto de partida:
public ActionResult Index(int page = 1, string sort = "Apellidos", string sortDir = "ASC")
{
    // Obtener el número total de personas
    // Obtener la colección de personas de la página actual
    // Retornar la vista suministrándole esos datos
}
Observad el uso de parámetros opcionales para la acción, en los que especificamos un valor por defecto para cuando no estén indicados de forma explícita en la petición.

Ya en el cuerpo del método, la obtención del número de personas es inmediata gracias al método ContarPersonas() que hemos creado anteriormente en el Modelo. La obtención de las personas para poblar la rejilla depende del enfoque utilizado en la implementación del método ObtenerPaginaDePersonas(). A continuación veremos algunas posibilidades, aunque antes vamos a pararnos en otro detalle.

A diferencia del ejemplo del post anterior, en el que la Vista sólo necesitaba una lista de personas para maquetarse, en esta ocasión debemos suministrarle alguna información más:
  • el número de personas por página,
  • la colección de personas, aunque sólo las presentes en la página actual,
  • el número total de personas, para que WebGrid pueda crear la herramienta de navegación por páginas.
Por tanto, nos encontramos ante un escenario “de manual” para el uso de una entidad View Model, que contendrá toda esta información. Su definición podría ser la siguiente:
public class PaginaDePersonasViewModel
{
    public int NumeroDePersonas { get; set; }
    public IEnumerable<Persona> Personas { get; set; }
    public int PersonasPorPagina { get; set; }
}
De esta forma, podemos ir ya dando forma al cuerpo de la acción, que quedaría de la siguiente manera:
public ActionResult Index(int page = 1, string sort = "Apellidos", string sortDir = "ASC")
{
    const int personasPorPagina = 10;
    var numPersonas = _services.ContarPersonas();    var personas = ... // Obtener la colección de personas
    
    var datos = new PaginaDePersonasViewModel()
                    {
                        NumeroDePersonas = numPersonas,
                        PersonasPorPagina = filasPorPagina,
                        Personas = personas
                    };
    return View(datos);
}
Como comentábamos anteriormente, la obtención de las personas a mostrar en la página actual dependerá de la implementación del Modelo. Veremos algunas posibilidades.

Una solución muy simple aunque bastante cándida e inocentona, basada en la primera de las implementaciones del Modelo que hemos visto anteriormente, podría ser la siguiente:
var personas = _services.ObtenerPaginaDePersonas(
                     page, 
                     personasPorPagina, 
                     "it." + sort + " " + sortDir
               );
Como podemos observar, construimos directamente la expresión de ordenación en Entity SQL basándonos en los parámetros recibidos en el query string. Obviamente, y dado que estos parámetros son fácilmente manipulables, un nombre de columna incorrecta o una dirección distinta de “ASC” o “DESC” provocarían una excepción en tiempo de ejecución:

Error al ordenar por una columna inexistente
Este error es fácil de evitar simplemente introduciendo código que compruebe estos parámetros y establezca valores por defecto en caso de existir algún problema, como el mostrado a continuación, donde comprobamos que la columna de ordenación se encuentra en una “lista blanca” de columnas permitidas, y que la ordenación es ascendente o descendente:
...
sortDir = sortDir.Equals("desc", StringComparison.CurrentCultureIgnoreCase) ? sortDir : "asc";
var validColumns = new[] { "apellidos", "fechanacimiento", "email", "numerodehijos" };
if (!validColumns.Any(c => c.Equals(sort, StringComparison.CurrentCultureIgnoreCase)))
    sort = "apellidos";
var personas = _services.ObtenerPaginaDePersonas(
                    page, 
                    personasPorPagina, 
                    "it." + sort + " " + sortDir
              );
...
Si en cambio preferimos utilizar en el Modelo la opción que vimos anteriormente basada en el uso de árboles de expresión, también podemos crear un código que suministre los criterios de ordenación en función de la columna y dirección actual:
IEnumerable<Persona> personas;
Direccion dir = sortDir.Equals("ASC", StringComparison.CurrentCultureIgnoreCase) ? 
                        Direccion.Ascendente:
                        Direccion.Descendente;
 
switch(sort.ToLower())
{
  case "fechanacimiento":
    personas = _services.ObtenerPaginaDePersonas(page, personasPorPagina, p => p.FechaNacimiento, dir);
    break;
  case "numerodehijos":
    personas = _services.ObtenerPaginaDePersonas(page, personasPorPagina, p => p.NumeroDeHijos, dir);
    break;
  case "email":
    personas = _services.ObtenerPaginaDePersonas(page, personasPorPagina, p => p.EMail, dir);
    break;
  case "apellidos":
    personas = _services.ObtenerPaginaDePersonas(page, personasPorPagina, p => p.Apellidos, dir);
    break;
  default:
    personas = _services.ObtenerPaginaDePersonas(page, personasPorPagina, p => p.Apellidos, dir);
    break;
}
En el proyecto que podréis descargar desde el enlace disponible al final del post, encontraréis ambas implementaciones completas.

Antes de pasar a la Vista, veamos el código completo del controlador pasando los criterios de ordenación al Modelo mediante cadenas. Exceptuando las líneas introducidas para mejorar la legibilidad del código, apenas llegamos a la docena de líneas para completar la acción:
public class Demo2Controller : Controller
{
    private ModelServices _services = new ModelServices();
 
    public ActionResult Index(int page = 1, string sort = "Apellidos", string sortDir = "ASC")
    {
        const int personasPorPagina = 10;
        var numPersonas = _services.ContarPersonas();
 
        sortDir = sortDir.Equals("desc", StringComparison.CurrentCultureIgnoreCase) ? sortDir : "asc";
        
        var validColumns = new[] { "apellidos", "fechanacimiento", "email", "numerodehijos" };
        if (!validColumns.Any(c => c.Equals(sort, StringComparison.CurrentCultureIgnoreCase)))
            sort = "apellidos";
        
        var personas = _services.ObtenerPaginaDePersonas(
                 page, 
                 personasPorPagina, 
                 "it." + sort + " " + sortDir
        );
 
        var datos = new PaginaDePersonasViewModel()
        {
            NumeroDePersonas = numPersonas,
            PersonasPorPagina = personasPorPagina,
            Personas = personas
        };
        return View(datos);
    }
}

3. La Vista

La mayor parte de la Vista que implementamos en el post anterior sigue siendo válida, sólo tendremos que retocarle un par de detalles que encontramos en las primeras cuatro líneas.
@model WebGridDemo.ViewModels.PaginaDePersonasViewModel
@{
    ViewBag.Title = "Personas";
    WebGrid grid = new WebGrid(rowsPerPage: Model.PersonasPorPagina);
    grid.Bind(Model.Personas, autoSortAndPage: false, rowCount: Model.NumeroDePersonas);   }
En la primera línea, en la directiva @model debemos definir el tipo de datos recibidos desde el Controlador, que como ya hemos visto, en este caso se trata de una instancia de PaginaDePersonasViewModel que contiene toda la información que necesita la Vista para maquetarse apropiadamente.

A continuación, tras establecer el título de la página, instanciamos el WebGrid suministrándole a su constructor el valor del parámetro rowsPerPage, el número de filas por página que estamos utilizando, que es el mismo usado por el Controlador a la hora de solicitar los datos al Modelo.

Finalmente, invocamos a su método Bind(), donde podemos indicamos:
  • el conjunto de Personas a mostrar en la página actual,
  • que no deseamos utilizar la ordenación y paginación automática, estableciendo autoSortAndPage a false,
  • mediante el parámetro rowCount, el número total de personas almacenadas en la base de datos.
Y afortunadamente, esto es todo lo que necesitamos hacer en la Vista. Por supuesto, no es necesario tocar nada en lo relativo a la definición de columnas, formatos, etc.

4. Y recapitulando…

A lo largo de este post hemos vuelto a recorrer el Modelo, Controlador y Vista que ya implementamos hace unos días, comentando los cambios que tenemos que hacer para conseguir una paginación de datos más eficiente.

Hemos visto distintas alternativas para implementar el Modelo, basadas en Entity Framework. No son las únicas posibilidades ni mucho menos, pero espero al menos que os den ideas para implementar vuestras propias soluciones. También hemos reescrito el Controlador, implementando el consumo de estos servicios del Modelo para obtener justo la información que necesitamos para mostrar una página de datos, y la hemos pasado a la Vista, a la que hemos tenido que hacer sólo ligeras modificaciones.

Finalmente, como el post ha quedado algo extenso, repasamos rápidamente qué es necesario hacer para implementar un WebGrid con una paginación eficiente:
  • En el Modelo:
    • Necesitamos un mecanismo para obtener el número total de elementos.
    • Asimismo, tendremos que crear un método para obtener los elementos pertenecientes a una página concreta, atendiendo a los criterios de ordenación suministrados.
  • En el Controlador:
    • Debemos capturar los parámetros page, sort y sortDir de la petición, a través de los cuales podremos conocer la página a mostrar, la columna y dirección de ordenación, respectivamente.
    • Obtener desde el Modelo el número total de elementos, así como el conjunto de instancias pertenecientes a la página actual de datos, según los criterios de ordenación actuales.
    • Retornar la vista, suministrándole:
      • Los datos a mostrar.
      • El total de elementos.
      • El número de elementos por página que estamos usando
  • En la Vista:
    • Indicar, al instanciar el WebGrid, el número de elementos por página (dato enviado desde el Controlador).
    • Enlazar en WebGrid a la colección suministrada por el Controlador, desactivando la paginación y ordenación automática, e indicándole el total de elementos disponibles.
Y eso es todo. En total, aunque depende de la solución empleada, introducir una paginación eficiente a nuestros WebGrids no debe suponer mucho más de una veintena de líneas, que seguro vale la pena introducir dados los beneficios aportados al rendimiento de nuestras aplicaciones  :-)

image
Como en otras ocasiones, podéis descargar el proyecto desde SkyDrive (requiere VS2010, SQL Express y ASP.NET MVC 3). ¡Que aproveche! ;-)


Publicado en: Variable not found.
domingo, 6 de febrero de 2011
Estos son los enlaces publicados en Variable not found en Facebook y Twitter desde el domingo, 30 de enero de 2011 hasta el domingo, 06 de febrero de 2011.

Espero que te resulten interesantes. :-)
Y no olvides que puedes seguir esta información en vivo y en directo desde Variable not found en Facebook, o a través de Twitter.

Publicado en: Variable not found