..:: MX Studio Fóruns ::..: Paginação estilo wp-pagenavi plugin do wordpress - ..:: MX Studio Fóruns ::..

Jump to content

Publicidade




Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

Paginação estilo wp-pagenavi plugin do wordpress

#1 User is offline   xanburzum 

  • Group: Administrador
  • Posts: 2076
  • Joined: 04-November 08

Posted 02 May 2010 - 09:03 PM

Sabemos que existem várias formas de paginação com ASP, mas consegui, de um modo extremamente compacto, desenvolver uma paginação estilo a wp-PageNavi, que é um Plugin que uso e que vários blogueiros usam no WordPress. Usei um pouco de CSS, mas que não vem ao caso, e banco MySQL. Vamos lá, então!!

O banco MySQL fica assim:

Nome da Tabela: TabelaDados

Coluna 01: Codigo - INT(1) NOT NULL, PRIMARY, AUTO
Coluna 02: Unidade - VARCHAR(5) NULL

Coluna 03: Nome - VARCHAR(100) NULL
Criamos uma estrutura simples de página HTML para receber as informações, ficando assim:

CÓDIGO
  <%@ Language="VBScript" %>  
<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<title>Paginando Dados</title>  
</head>  
<style type="text/css">  
.table {border: 1px solid #FF9933;}  
.table td {border: 1px solid #FF9933;}  
.pagNumberMark {background: #B5C905; font: 12px Arial; color: #FFFFFF;}  
.pagNumber {background: #333333; font: 12px Arial; color: #FFFFFF;}  
.fonteBr {font: 14px Arial; color: #FFFFFF;}  
.fontePr {font: 12px Arial; color: #000000;}  
.fontePontos {border: 1px solid #333333; font: 14px Arial; color: #000000; background: #FFFFFF;}  
.a {text-decoration: none;}  
.fonte {font: 12px Arial; color: #FFFFFF;}  
</style>  
<body>


Abaixo da tag vamos criar as tabelas necessárias. Em particular criei uma tabela com duas linhas e, na primeira linha, criei uma tabela com duas linhas e 3 colunas para colocar as informações do banco. Façam como acharem melhor.

Fiz minha conexão com o banco e logo abaixo criei um RecordSet para meu SQL, limitei 15 linhas por página e usei o CursorLocation = 3.

Usei o PageCount para saber quantas páginas foram criadas, assim posso usar essa informação em qualquer lugar da aplicação.

CÓDIGO
   1. <table width="600" border="0" align="center" cellpadding="0" cellspacing="0">  
    <%  
    Dim Conexao  
   Set Conexao = Server.CreateObject("Adodb.Connection")  
    Conexao.ConnectionString = "Driver=MySQL ODBC 3.51 Driver; DataBase=xxxxxxx; Server=xxxxxx; Uid=xxxx; PassWord=xxxxx;"  
    Conexao.Open  
      
   Dim Rs_DADOS, PagNav, TotalPag  
   Dim Anterior, Proximo, Jo, PaginaVisita  
Set Rs_DADOS = Server.CreateObject("Adodb.RecordSet")  
  
Conexao.CursorLocation = 3  
Rs_DADOS.PageSize = 15  
Rs_DADOS.Open "Select Codigo, Unidade, Nome From TabelaDados Order By Nome Desc",Conexao  
  
If Rs_DADOS.Eof Then  
    Response.Write("<tr><td height=""28"" align=""center"">LISTA VAZIA</td></tr>")  
Else  
    PagNav = CInt(Request.QueryString("Pages"))  
  
    If (PagNav = 0) Then : PagNav = 1 : End If  

    Rs_DADOS.AbsolutePage = PagNav  
     TotalPag = Rs_DADOS.PageCount  
%>  
<tr>  
<td><table class="table" width="600" border="0" cellspacing="0" cellpadding="0">  
     <tr class="fonteBr">  
       <td width="145" height="36" align="center" bgcolor="#FFBA75"><strong>CÓDIGO</strong></td>  
<td width="334" align="center" bgcolor="#FFBA75"><strong>NOME</strong></td>  
     <td width="119" align="center" bgcolor="#FFBA75"><strong>UNIDADE</strong></td>  
    </tr>


Criei um While baseado na função AbsolutePage, assim posso ter controle também das páginas, para quando eu quiser voltar ou avançar. A variável PagNav está tendo o valor da página atual.

CÓDIGO
   1. <% While Not Rs_DADOS.Eof And Rs_DADOS.AbsolutePage = PagNav %>  
<tr class="fontePr">  
    <td height="27" align="center"><% Response.Write(Rs_DADOS("Codigo")) %></td>  
    <td align="center"><% Response.Write(Rs_DADOS("Nome")) %></td>  
     <td align="center"><% Response.Write(Rs_DADOS("Unidade")) %></td>  
  </tr>  
     <%  
  Rs_DADOS.MoveNext : Wend  
  
    Anterior = PagNav - 1  
   Proximo = PagNav + 1  
     If (Anterior <= 0) Then : Anterior = 1 : End If  
    If (Proximo > TotalPag) Then : Proximo = TotalPag : End If  
    %>  
  </table></td>  
</tr>


Agora abaixo tem a arte mais complicada e chata de se aplicar.

CÓDIGO
<tr>  
<td height="28"> </td>  
</tr>  
<tr>  
<td align="center"><table width="457" height="41" border="0" cellpadding="0" cellspacing="4">  
<tr>  
   <td width="300" height="30" align="center" class="fontePr"><%  
If Request.QueryString("Pages") = "" Then  
     Response.Write("Página 1 de "&TotalPag)  
Else  
     Response.Write("Página "&Request.QueryString("Pages")&" de "&TotalPag)  
End If  
%></td>  
   <td width="42" align="center" class="pagNumber"><a href="?Pages=1" class="fonte"> « Início </a>  
<%  
PaginaVisita = CInt(Request.QueryString("Pages"))  
  
If PagNav > 1 Then  
     Response.Write("<td width=""36"" align=""center"" "& _  
     "class=""pagNumberMark""><a href=""?Pages="&Anterior&""" "& _  
     "style=""font: 12px Arial; color: #FFFFFF;""> « </a></td>")  
End If  
  
If PagNav > 5 Then  
     Response.Write("<td width=""28"" align=""center"" class=""fontePontos""> ... </td>")  
End If  
%>


Eu limitei para aparecer cinco links por, [1] [2] [3] [4] [5], isso logo nos primeiros IF's, os outros são para quando for uma menor quantidade de registro, exemplo [19] [20] [21], que não tem cinco links.

Segue o final do código:
Caso o conteúdo fique com 5 páginas ou abaixo

CÓDIGO
   <%  
If PagNav <= 5 Then  
If TotalPag >= 5 Then  
For Jo = 1 To 5  
  If PagNav = Jo Then  
        Response.Write("<td width=""36"" align=""center"" class=""pagNumberMark""> "& _  
        " <strong>"&Jo&"</strong> </td>")  
   Else  
        Response.Write("<td width=""36"" align=""center"" class=""pagNumber""> "& _  
        "<a href=""?Pages="&Jo&""" class=""fonte""> "&Jo&" </a></td>")  
     End If  
Next  
Else  
For Jo = 1 To TotalPag  
     If PagNav = Jo Then  
         Response.Write("<td width=""36"" align=""center"" class=""pagNumberMark""> "& _  
        " <strong>"&Jo&"</strong> </td>")  
     Else  
         Response.Write("<td width=""36"" align=""center"" class=""pagNumber""> "& _  
         "<a href=""?Pages="&Jo&""" class=""fonte""> "&Jo&" </a></td>")  
    End If  
Next  
End If  
End If  
%>


Aqui é caso fique mais de 5 páginas ele vai colocando o seletor de páginas no meio e abrindo a paginação

CÓDIGO
  <%  
If PagNav > 5 Then  
     PagNav = PagNav + 4  
     Pg = PagNav  
   MaxB = Request.QueryString("Pages") - 1  

    If (MaxB + 1) = TotalPag Then  
    For Jo = MaxB To (Pg - 4)  
         If PaginaVisita = Jo Then  
            Response.Write("<td width=""36"" align=""center"" class=""pagNumberMark""> "& _  
            " <strong>"&Jo&"</strong> </td>")  
       Else  
             Response.Write("<td width=""36"" align=""center"" class=""pagNumber""> "& _  
            "<a href=""?Pages="&Jo&""" class=""fonte""> "&Jo&" </a></td>")  
        End If  
     Next  
     ElseIf (MaxB + 2) = TotalPag Then  
     For Jo = MaxB To (Pg - 3)  
        If PaginaVisita = Jo Then  
             Response.Write("<td width=""36"" align=""center"" class=""pagNumberMark""> "& _  
            " <strong>"&Jo&"</strong> </td>")  
        Else  
             Response.Write("<td width=""36"" align=""center"" class=""pagNumber""> "& _  
             "<a href=""?Pages="&Jo&""" class=""fonte""> "&Jo&" </a></td>")  
         End If  
    Next  
    Else  
     For Jo = (MaxB - 1) To (Pg - 2)  
        If PaginaVisita = Jo Then  
             Response.Write("<td width=""36"" align=""center"" class=""pagNumberMark""> "& _  
             " <strong>"&Jo&"</strong> </td>")  
        Else  
            Response.Write("<td width=""36"" align=""center"" class=""pagNumber""> "& _  
             "<a href=""?Pages="&Jo&""" class=""fonte""> "&Jo&" </a></td>")  
         End If  
     Next  
     End If  
End If  
  
If (TotalPag <> PaginaVisita) And (TotalPag >= 5) Then  
     Response.Write("<td width=""28"" align=""center"" class=""fontePontos""> ... </td>")  
End If  
%>  
   <td width="34" align="center" class="pagNumberMark"><a href="?Pages=<% Response.Write(Proximo) %>" class="fonte"> » </a></td>  
   <td width="42" align="center" class="pagNumber"><a href="?Pages=<% Response.Write(TotalPag) %>" class="fonte"> Final » </a></td>  
</tr>  
</table></td>  
</tr>  
<%  
End If  
Set Rs_DADOS = Nothing  
%>  
</table>  
</body>  
</html>

0

Share this topic:


Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic



Publicidade




1 User(s) are reading this topic
0 membro(s), 1 visitante(s) e 0 membros anônimo(s)