Archivo Junio, 2009

Utilizar un DataPager haciendo el DataBind en Code-Behind

Por Pablo Viale - ASP.NET 2.0 / 3.5 - 9 Junio 2009

Como expliqué en mi post anterior:
http://www.viale.com.mx/2009/06/09/como-utilizar-un-control-datapager-con-listview-para-crear-paginas-de-registros/

es posible utilizar un DataPager con un ListView de la siguiente manera:

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>

Ahora bien, si haces el Bind con un ObjectDataSource o algún control similar en el archivo .aspx, todo funciona perfectamente.

Sin embargo, si estás haciendo el DataBind en el código de servidor (code-behind), entonces te darás cuenta de que al hacer clic en la página número 2 (por ejemplo) del paginador, no ocurre nada, se sigue mostrando la primera página.

Esto es debido a que estás llenando el ListView en el código de servidor.

Para solucionarlo, debes colocar el siguiente procedimiento en tu archivo .aspx.vb:

Clic para mostrar texto plano
VB.NET:
  1. Protected Sub LVRegistros_PagePropertiesChanging(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.PagePropertiesChangingEventArgs) Handles LVRegistros.PagePropertiesChanging
  2.         Pager1.SetPageProperties(e.StartRowIndex, e.MaximumRows, False)
  3.         LVReflexiones.DataBind()
  4.     End Sub

Ahora pruébalo y verás como todo funciona como debe.

8 Comentarios

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

Por Pablo Viale - ASP.NET 2.0 / 3.5 - 9 Junio 2009

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!

3 Comentarios