Comunidad de diseño web y desarrollo en internet online

como aplicar estilo a este paginador php

Citar            
MensajeEscrito el 23 Mar 2017 10:40 pm
tengo el siguiente codigo...

Código PHP :

<?php
//SELECT * FROM tabla ORDER BY date DESC LIMIT 10
$sql="select * from inventario where admin=1 order by id DESC";

//Limito la busqueda
$TAMANO_PAGINA = 5;

//examino la página a mostrar y el inicio del registro a mostrar
$pagina = $_GET["pagina"];
if (!$pagina) {
    $inicio = 0;
    $pagina=1;
}
else {
    $inicio = ($pagina - 1) * $TAMANO_PAGINA;
} 

//session_start();
//$_SESSION['sql']=$sql;

$link=mysql_connect("localhost","usuario","contrasena");
mysql_select_db("basededatos",$link);

//miro a ver el número total de campos que hay en la tabla con esa búsqueda
$ssql = $sql." ". $criterio;
$rs = mysql_query($ssql,$link);
$num_total_registros = mysql_num_rows($rs);
//calculo el total de páginas
$total_paginas = ceil($num_total_registros / $TAMANO_PAGINA);

//pongo el número de registros total, el tamaño de página y la página que se muestra
//echo "N&uacute;mero de registros encontrados: " . $num_total_registros . "<br>";
//echo "Se muestran p&aacute;ginas de " . $TAMANO_PAGINA . " registros cada una<br>";
//echo "Mostrando la p&aacute;ginas " . $pagina . " de " . $total_paginas . "<p>"; 

//construyo la sentencia SQL
$ssql = $sql." " . $criterio . " limit " . $inicio . "," . $TAMANO_PAGINA;
$rs = mysql_query($ssql,$link);

if(mysql_num_rows($rs)>0){
 echo "<center><table width='742' border='0' align='center' cellpadding='0' cellspacing='0'><tr>
      <td width='76'></td>
      <td width='338'></td>
      <td width='11'></td>
</tr>
  "; 

   while($col=mysql_fetch_array($rs))
   {
   if($col["tipo_negocio"]=="venta"){
   $titulo1="SE VENDE";
   }elseif($col["tipo_negocio"]=="arriendo"){
   $titulo1="SE ARRIENDA";
   }elseif($col["tipo_negocio"]=="ventayarriendo"){
   $titulo1="SE VENDE O ARRIENDA";
   }else{
   $titulo1="";}   
   if($col[tipo_propiedad]=="Cabana"){
   $tipopro="CABAÑA O FINCA";
   }elseif($col[tipo_propiedad]=="Local"){
   $tipopro="LOCAL COMERCIAL";
   }elseif($col[tipo_propiedad]=="Casa"){
   $tipopro="CASA";
   }elseif($col[tipo_propiedad]=="Apartaestudio"){
   $tipopro="APARTA ESTUDIO";
   }elseif($col[tipo_propiedad]=="Apartamento"){
   $tipopro="APARTAMENTO";
   }if($col[nro_habitaciones]!=""){
   $habita="Habitaciones: $col[nro_habitaciones]";
      }else{
   $habita="";}
   if($col[nro_banos_privados]!=""){
   $bano="Baños: $col[nro_banos_privados]";
   }else{
   $bano="";}
      $sql_img="select * from fotos where codigo_fotos='$col[codigo]' LIMIT 1";
   $resp_img=mysql_query($sql_img,$link) or die( "Error en query: $sql, el error  es: " . mysql_error() );

   $col_img=mysql_fetch_array($resp_img);
      
   echo'<tr>
    <th bgcolor="#FFFFFF" style="border-width: 0px; text-align: left;" scope="col">&nbsp;</th>
    <th rowspan="4" bgcolor="#FFFFFF" style="border-width: 0px; text-align: left;" scope="col"><a href="index_vista_inmueble.php?codigo='.$col["codigo"].'"><img src="fotos/admin/uploads/inmuebles/'.$col_img["fotos"].'"></a></th>
    <th bgcolor="#FFFFFF" style="border-width: 0px; text-align: left;" scope="col">&nbsp;</th>
    <th bgcolor="#FFFFFF" style="border-width: 0px; text-align: left;" scope="col">&nbsp;</th>
    </tr>
    <tr>
      <td rowspan="3" bgcolor="#FFFFFF" style="border-width: 1px;">&nbsp;</td>
      <td rowspan="3" bgcolor="#FFFFFF" style="border-width: 1px;">&nbsp;</td>
      <td bgcolor="#FFFFFF"><span style="border-width: 0px; text-align: left; font-weight: bold;"><a href="index_vista_inmueble.php?codigo='.$col["codigo"].'">'.$titulo1.' - '.$tipopro.' </a></span></td>
    </tr>
    <tr>
    <td bgcolor="#FFFFFF"><span style="border-width: 1px; color: #F00; font-weight: bold; text-align: right;">CODIGO: '.$col["codigo"].'</span></td>
    </tr>
  <tr>
    <td align="justify" width="317" height="190" bgcolor="#FFFFFF"><span style="border-width: 0px;">'.ucfirst(substr($col["descripcion_propiedad"],0,395)).'...</span><strong><br>
      <br>
     '.$habita.'
      <br>
      '.$bano.'
      <br>
      <a href="index_vista_inmueble.php?codigo='.$col["codigo"].'"><img src="vermas.fw.png" style="width: 228px; height: 39px; float:right;"></a><br>
      <br></td>
    </tr>
  <tr>
    <td bgcolor="#FFFFFF" style="border-width: 1px;">&nbsp;</td>
    <td bgcolor="#FFFFFF" style="border-width: 1px;">&nbsp;</td>
    <td bgcolor="#FFFFFF" style="border-width: 1px;">&nbsp;</td>
    <td bgcolor="#FFFFFF" style="border-width: 1px;">&nbsp;</td>
    </tr>
  ';
   }
}
echo "</table></center>";
//muestro los distintos índices de las páginas, si es que hay varias páginas
if ($total_paginas > 1){
    for ($i=1;$i<=$total_paginas;$i++){
       if ($pagina == $i)
          //si muestro el índice de la página actual, no coloco enlace
          echo $pagina . " ";
       else
          //si el índice no corresponde con la página mostrada actualmente, coloco el enlace para ir a esa página
          echo "<a href='index.php?pagina=" . $i . "&criterio=" . $txt_criterio . "'>" . $i . "</a> ";
        
    }
}
echo "</center></br>";   
?>


el cual al usarlo me muestra la información pero el paginador muy sencillo asi:




encontre esta web la cual es donde se muestra como realizar paginaciones php a los resultados

https://www.jose-aguilar.com/blog/css-pagination/

en la cual se muestra luego como ponerle estilos css a este paginador para ponerlo asi



el ejemplo usa este style css

Código CSS :

.pagination {
    height: 36px;
    margin: 18px 0;
}
.pagination ul {
    border-radius: 3px 3px 3px 3px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    display: inline-block;
    margin-bottom: 0;
    margin-left: 0;
}
.pagination li {
    display: inline;
}
.pagination a {
    -moz-border-bottom-colors: none;
    -moz-border-image: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #DDDDDD;
    border-style: solid;
    border-width: 1px 1px 1px 0;
    float: left;
    line-height: 34px;
    padding: 0 14px;
    text-decoration: none;
}
.pagination a:hover, .pagination .active a {
    background-color: #F5F5F5;
}
.pagination .active a {
    color: #999999;
    cursor: default;
}
.pagination .disabled a, .pagination .disabled a:hover {
    background-color: transparent;
    color: #999999;
    cursor: default;
}
.pagination li:first-child a {
    border-left-width: 1px;
    border-radius: 3px 0 0 3px;
}
.pagination li:last-child a {
    border-radius: 0 3px 3px 0;
}
.pagination-centered {
    text-align: center;
}
.pagination-right {
    text-align: right;
}



pero no he podido aplicarlo en mi caso....

una ayuda, y muchas gracias...

Por flashtrix

21 de clabLevel



Genero:Masculino  

chrome
Citar            
MensajeEscrito el 26 Mar 2017 04:20 pm
Ademas de incluir el css en tu PHP, debes aplicar la clase pagination al contenedor, por ejemplo en la tabla

<table class="pagination">

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

chrome
Citar            
MensajeEscrito el 27 Mar 2017 12:46 am
Hola Muchas gracias por responder..
le he puesto el class al div que lo contiene asi..

Código PHP :

..... 
<div class="pagination" id="miniImg">
<!-- PAGINACION --><!-- FIN PAGINACION -->
                <?php
//SELECT * FROM tabla ORDER BY date DESC LIMIT 10
$sql="select * from inventario where admin=1 order by id DESC";
.....


pero me resulta así el paginador.. no sale como debería salir...

Por flashtrix

21 de clabLevel



Genero:Masculino  

chrome
Citar            
MensajeEscrito el 27 Mar 2017 12:24 pm
Es estilo mas estructura. Mira que el div contenedor ocupe todo el ancho, mira el source de la página y analiza cual es la estructura resultante, posiblemente el overflow del contenedor sea right, etc

Jorge

Por solisarg

BOFH

13669 de clabLevel

4 tutoriales
5 articulos

Genero:Masculino   Bastard Operators From Hell Premio_Secretos

Argentina

chrome

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.