HTML - lista paginada con bootstrap 4

 
Vista:
sin imagen de perfil

lista paginada con bootstrap 4

Publicado por Eduardo (4 intervenciones) el 04/02/2021 17:09:01
Saludos amigos,

Tengo este maqueteado que me muestra una lista de productos:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<body>
 
   <div class="container-fluid">
 
      <div class="container-fluid">
         ...
      </div>
 
      <div class="container-fluid">
         <?php include 'lista_cargar.php' ; ?>
      </div>
 
      <div class="container-fluid">
         ...
      </div>
 
   </div>
 
</body>

Dentro de lista_cargar.php tengo esta sección que carga el paginado de la lista:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
if ( $bus_tipo == 'xpagi' ) {
    $list_count = GetListLong() ;
    $tota_pages = ceil( $list_count/30 ) ;
    $page_anter = $bus_pagi-1 ;
    $page_proxi = $bus_pagi+1 ;
    echo "<nav aria-label='Pags.:'>" ;
        echo "<ul class='pagination'>" ;
        if ($bus_pagi > 1) {
           echo "<li class='page-item'><a class='page-link' href='lista.php?buspag=".$page_anter."'>Ant.</a></li>" ;
        }else{
           echo "<li class='page-item disabled'><a class='page-link' href='#' tabindex='-1' aria-disabled='true'>Ant.</a></li>" ;
        }
        for ( $pagnum = 1 ; $pagnum<=$tota_pages ; $pagnum++ ) {
           if ( $pagnum == $bus_pagi ) {
              echo "<li class='page-item active'><a class='page-link' tabindex='-1' aria-disabled='true' href='#'>".$pagnum."</a></li>" ;
           }else{
              echo "<li class='page-item'><a class='page-link' href='lista.php?buspag=".$pagnum."'>".$pagnum."</a></li>" ;
           }
        }
        if ($bus_pagi < $tota_pages) {
           echo "<li class='page-item'><a class='page-link' href='lista.php?buspag=".$page_proxi."'>Prox.</a></li>" ;
        }else{
           echo "<li class='page-item disabled'><a class='page-link' href='#' tabindex='-1' aria-disabled='true'>Prox.</a></li>" ;
        }
        echo "</ul>" ;
    echo "</nav>";
}

Estoy usando bootstrap 4, el tema es que como muestro 30 productos por página, me carga un indice bastante largo de casi 60 páginas que se desborda a lo ancho:

paginacion

Mi pregunta es como puedo hacer para que el indice se cargue en dos líneas y se vea del mismo ancho que el resto de la lista.

Gracias anticipadas por su gentil respuesta.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder

lista paginada con bootstrap 4

Publicado por Jhon (1 intervención) el 25/03/2023 02:46:39
Tengo el mismo problema....
¿Alguien habrá encontrado una solución?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Jaymmander

lista paginada con bootstrap 4

Publicado por Jaymmander (6 intervenciones) el 30/03/2023 18:02:36
modifica la validación para que el for se detenga en 30. es mejor para estos casos usar si o si un While con fetch associative array donde también se detenga en 30. y el tema del indice ya es cuestion de tocar las tablas de boostrap. o css directo.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar