0

he realizado una subpagina donde he incluido un pagination para moverse entre los datos de la tabla, pero tengo un problema: Donde muestro los primeros datos es en listaproductos?page=1 o listaproductos.php pero el cuando estoy en la primera pagina me deja darle al button de "Anterior" y me lleva a ?page=0 y me da un error ya que no existe esa pagina. ¿Alguien sabría como deshabilitar los botones de "Anterior" en la primera página y "Siguiente" en la última página? Muchas gracias a todos. Mi codigo:

 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="css/addproductos.css?ver=5">
<link rel="stylesheet" type="text/css" href="css/sidebar.css?ver=6">
<link rel="stylesheet" type="text/css" href="css/header.css?ver=4">
<style>
#main-information {
    width: 100%;
    margin-top: 3%;
    padding: 20px;
    min-height: 100vh;
    transition: all 0.3s;
} 
.content-header {
    padding: 10px .5rem;
}
.well {
    min-height: 20px;
    padding: 19px;
    margin-bottom: 20px;
    background-color: #f5f5f5;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
}
.pagination > li > a
{
    background-color: grey;
    color: white;
}
</style>
<link rel="icon" href="https://image.flaticon.com/icons/svg/423/423080.svg" >
    <title>LISTA DE PRODUCTOS - PABLOWEBDEV.COM</title>
</head>
<body>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>

<?php
session_start();
require 'lib/checklogin.php';
?>
<div class="wrapper">
    <?php
    require 'lib/header.php';
    require 'lib/sidebar.php';
    ?>
    <div id="main-information">
    <div class="content-header">
      <div class="container-fluid">
        <div class="row mb-2">
          <div class="col-sm-6">
            <h1 class="m-0 text-dark">Lista de productos</h1>
          </div><!-- /.col -->
          <div class="col-sm-6">
            <ol class="breadcrumb float-sm-right">
              <li class="breadcrumb-item"><a href="#">Lista de productos</a></li>
              <li class="breadcrumb-item active">Index</li>
            </ol>
          </div><!-- /.col -->
        </div><!-- /.row -->
      </div><!-- /.container-fluid -->
    </div> <!--- content header --->

<?php
require 'logic/conexion.php';
$limite=10;
 $page = isset($_GET['page']) ? $_GET['page'] : 1;
 $start=($page - 1) * $limite;

$result=$conexion->query("SELECT * FROM productos LIMIT $start, $limite");
$customers=$result->fetch_all(MYSQLI_ASSOC);

$result1=$conexion->query("SELECT count(id) AS id FROM productos");
$custcount=$result1->fetch_all(MYSQLI_ASSOC);
$total=$custcount[0]['id'];
$pages= ceil($total/$limite);

$previous= $page - 1;
$next = $page + 1;
?>

<div class=container>
<table class="table">
  <thead class="thead-dark table-bordered">
    <tr>
      <th scope="col">ID</th>
      <th scope="col">Nombre</th>
      <th scope="col">Precio compra</th>
      <th scope="col">Precio venta</th>
      <th scope="col">Link</th>
      <th scope="col">Sección</th>
      <th scope="col">Ganancia</th>
    </tr>
  </thead>
  <tbody>
    <?php
        foreach($customers as $customer) : ?>
    <tr style="color: black;">
            <td style="background-color:#DEE0E3;"><?= $customer['id']?></td>
            <td style="background-color:#DEE0E3;"><?= $customer['nombre']?></td>
            <td style="background-color:#DEE0E3;"><?= $customer['precioinicial']?>€</td>
            <td style="background-color:#DEE0E3;"><?= $customer['precioventa']?>€</td>
            <td style="background-color:#DEE0E3;"><?= $customer['link']?></td>
            <td style="background-color:#DEE0E3;"><?= $customer['seccion']?></td>
            <td style="background-color:#DEE0E3;"><?= $customer['ganancia']?>€</td>          
    </tr>
    <?php endforeach ?>
  </tbody>
</table>
</div> <!---- TERMINA CONTAINER ---->
<nav aria-label="Page navigation example">
  <ul class="pagination justify-content-center">
    <li class="page-item" >
      <a class="page-link" href="listaproductos.php?page=<?= $previous;?>">Anterior</a>
    </li>
    <?php for($i = 1; $i<=$pages; $i++) : ?>
    <li class="page-item"><a class="page-link" href="listaproductos.php?page=<?= $i; ?>"><?= $i; ?></a></li>
    <?php endfor;?>
    <li class="page-item">
      <a class="page-link" href="listaproductos.php?page=<?= $next;?>">Siguiente</a>
    </li>
  </ul>
</nav> 


    </div>  <!-- TERMINA MAIN INFORMATION --->
</div> <!-- TERMINA WRAPPER --->

</body>
</html>
</html>

2 respuestas 2

0

De esta manera te inhabilitará el elemento con la clase CSS de bootstrap llamada "disabled".

Espero que te ayude mi respuesta:

<nav aria-label="Page navigation example">
    <ul class="pagination justify-content-center">
        <li class="page-item <?=  $_GET['page'] == 1 ? 'disabled' : '' ?>">
            <a class="page-link" href="index.php?page=<?= $previous; ?>">Anterior</a>
        </li>
        <?php for ($i = 1; $i <= $pages; $i++) : ?>
            <li class="page-item"><a class="page-link" href="index.php?page=<?= $i; ?>"><?= $i; ?></a></li>
        <?php endfor; ?>
        <li class="page-item <?= $_GET['page'] == $pages ? 'disabled' : '' ?>">
            <a class="page-link" href="index.php?page=<?= $next; ?>">Siguiente</a>
        </li>
    </ul>
</nav>

Explicación breve:

Compara si la página actual es igual a la página 1, si es así añade la clase disabled que inhabilitará el elemento y no te dejará pulsarlo.

<li class="page-item <?=  $_GET['page'] == 1 ? 'disabled' : '' ?>">

Compara si la página actual es igual al total de páginas, si es así añade la clase disabled que inhabilitará el elemento y no te dejará pulsarlo.

<?= $_GET['page'] == $pages ? 'disabled' : '' ?>"
1
  • Muchisimas gracias! funciona
    – Pablo
    Commented el 10 abr. 2020 a las 12:22
0

tendrias que hacer una condicion pj:

if($_GET['page'] > $tu_variable_de_paginas_actules || $_GET['pag'] <= 0){
   //Lo envias al pag=1
   header('Location: index.php?pag=1');
}

osea si el valor es verdadero y es mayor a tus paginas actuales (mostrar registris que no existen lo envias al index y si es verdaderos y es menor a 0 o 0 negativo lo envias al index

para deshabilitar el anterior y siguiente seria el mismo mecanismo, validando tus variable de pag actual y siguiente o anterior

8
  • Tienes un problema de comillas al inicio
    – user128299
    Commented el 9 abr. 2020 a las 16:16
  • Gracias BetaM, editado Commented el 9 abr. 2020 a las 16:23
  • Me realiza un bucle infinito de redirects
    – Pablo
    Commented el 9 abr. 2020 a las 16:45
  • fijate si lo estas colocando bien a tu script y las variables sean validas, por ejemploi y por lo q ue llego a entender de lo tuyo la variable $tu_variable_de_paginas_actules que te puse en mi ejemplo, seria tu variable $pages Commented el 9 abr. 2020 a las 16:50
  • if($_GET['page'] > $pages || $_GET['page'] <= 0){ //Lo envias al pag=1 echo ("<script LANGUAGE='JavaScript'> window.location.href='listaproductos.php'; </script>"); }
    – Pablo
    Commented el 9 abr. 2020 a las 16:56

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.