«
»

Cómo utilizar un control DataPager con ListView para crear páginas de registros


Supongamos que tenemos el siguiente ListView que toma datos de una tabla de la base de datos:

Clic para mostrar texto plano
ASP:
  1. <asp:ListView ID="LVRegistros" runat="server" DataKeyNames="IdRegistro"
  2.         ItemPlaceholderID="AquiVanLosItems">
  3.     <LayoutTemplate>
  4.         <table width="100%" border="0" cellpadding="5" cellspacing="0">
  5.             <tr>
  6.                 <td class="tdDatosTitulo">
  7.                     Nombre
  8.                 </td>
  9.             </tr>
  10.             <asp:PlaceHolder ID="AquiVanLosItems" runat="server"></asp:PlaceHolder>
  11.         </table>
  12.     </LayoutTemplate>
  13.     <ItemTemplate>
  14.         <tr>
  15.             <td>
  16.                 <%#Eval("IdRegistro")%>
  17.             </td>                               
  18.         </tr>
  19.     </ItemTemplate>
  20.     <EmptyDataTemplate>
  21.         No existen registros.
  22.     </EmptyDataTemplate>
  23. </asp:ListView>

Como puedes ver el primer renglón de la tabla contendrá el texto "Nombre" y los siguientes renglones se llenarán a partir de la información que exista en la base de datos.

Ahora bien, si existieran 50,000 registros, todos ellos aparecerían en la página, lo cual está lejos de ser óptimo.

Lo ideal es mostrar los primeros "n" registros y que después exista un paginador (o pager en inglés) tipo Google, que nos permita ir desplazándonos a través de las diferentes páginas de registros.

Con ASP.NET esto es muy sencillo. Basta incluir un control llamado DataPager dentro del LayoutTemplate del ListView.

El código quedaría así:

Clic para mostrar texto plano
ASP:
  1. <asp:ListView ID="LVRegistros" runat="server" DataKeyNames="IdRegistro"
  2.         ItemPlaceholderID="AquiVanLosItems">
  3.     <LayoutTemplate>
  4.         <table width="100%" border="0" cellpadding="5" cellspacing="0">
  5.             <tr>
  6.                 <td class="tdDatosTitulo">
  7.                     Nombre
  8.                 </td>
  9.             </tr>
  10.             <asp:PlaceHolder ID="AquiVanLosItems" runat="server"></asp:PlaceHolder>
  11.             <tr>
  12.                 <td colspan="7" class="TdPie">Páginas:
  13.                     <asp:DataPager ID="Pager1" runat="server" PageSize="30">
  14.                         <Fields>
  15.                             <asp:NumericPagerField ButtonCount="50" />
  16.                         </Fields>
  17.                     </asp:DataPager>
  18.                 </td>
  19.             </tr>
  20.         </table>
  21.     </LayoutTemplate>
  22.     <ItemTemplate>
  23.         <tr>
  24.             <td>
  25.                 <%#Eval("IdCarpeta")%>
  26.             </td>                               
  27.         </tr>
  28.     </ItemTemplate>
  29.     <EmptyDataTemplate>
  30.         No existen registros.
  31.     </EmptyDataTemplate>
  32. </asp:ListView>

El código anterior coloca una lista de números del 1 en adelante que se pueden cliquear para moverse a las diferentes páginas de registros. Si quieres, por ejemplo, que el paginador aparezca arriba y abajo de los registros, simplemente coloca otro DataPager donde lo necesites.

En este caso utilicé dentro de Fields un control llamado NumericPagerField, pero también puedes utilizar NextPreviousPagerField y TemplatePagerField.

Aquí encontrarás la referencia a toda la clase DataPager con la explicación completa de cada uno de sus componentes:
http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.datapager.aspx

Nota Si estás haciendo el DataBind en código de servidor (code-behind), lee tambíen este post:
http://www.viale.com.mx/2009/06/09/utilizar-un-datapager-haciendo-el-databind-en-code-behind/

Suerte!

Esta entrada fue escrita el 9 Junio 2009, 14:07 y archivada en ASP.NET 2.0 / 3.5. Puedes seguir las respuestas en esta entrada a través de RSS 2.0. Puede dejar una respuesta, o hacer trackback desde su propio sitio.

  1. #1 by fivezoom.com on 11 Julio 2009 - 12:14

    Saludos!He pasado por aqui ya que me han recomendado tu pagina, me gusto mucho. Te exsorto a que sigas escribiendo ya que lo haces muy bien y proporcionas informacion de interes.

    Citar

  2. #2 by alfredo on 18 Marzo 2011 - 18:53

    Muy buena tu explicacion,Excelente!!!

    Citar

  3. #3 by Pablo Viale on 19 Marzo 2011 - 12:54

    Qué bueno que les haya sido de utilidad! Saludos.

    Citar
(No será publicado)