Limit links to be displayed in PHP and Bootstrap paging

Asked

Viewed 968 times

1

Good morning! I would like a help to limit the amount of links and be displayed in the pagination. My links are displayed like this:

Previous 1 2 3 4 5 6 7 Next

For the number of links not getting too large, I’d like it to stay that way:

Previous 1 2 ... Next

Previous ... 3 4 5 ... Next

Previous ... 6 7 Next

My php + bootstrap code:

$pagina = (isset($_GET['pagina'])) ? (int)$_GET['pagina'] : 1;

$sql_pagina = "SELECT * FROM posts";     
$result_pagina = $conexao->prepare($sql_pagina);
$result_pagina->execute();
$numTotal = $result_pagina->rowCount();

$quantidade = 5;

$num_pagina = ceil($numTotal/$quantidade);

$inicio = ($pagina * $quantidade) - $quantidade;

...
código HMTL
...

<?php
$pagina_anterior = $pagina -1;
$pagina_posterior = $pagina + 1;
?>
<nav align="center" aria-label="Page navigation" class="nav-pagination" style="margin-bottom: 20px;">
    <ul class="pagination">
       <li>
       <?php 
       if($pagina_anterior != 0) { ?>
          <a href="http://www.arturluz.com/?pagina=<?php echo $pagina_anterior; ?>" aria-label="Previous">
             <span aria-hidden="true">Anterior</span>
          </a>
       <?php } else { ?>
             <span aria-hidden="true">Anterior</span>
       <?php } ?>
       </li>
       <?php 
           for($i = 1; $i < $num_pagina + 1; $i++){ ?>
                    <li><a href="http://www.arturluz.com/?pagina=<?php echo $i; ?>"><?php echo $i; ?></a></li>
       <?php } ?>
       <li>
           <?php 
           if($pagina_posterior <= $num_pagina) { ?>
              <a href="http://www.arturluz.com/?pagina=<?php echo $pagina_posterior; ?>" aria-label="Previous">
                 <span aria-hidden="true">Próximo</span>
              </a>
           <?php } else { ?>
              <span aria-hidden="true">Próximo</span>
            <?php } ?>
         </li>
      </ul>
    </nav>

Can anyone help me? Thank you!

1 answer

1

You don’t need the for to do this, because you set the variables pagina_anterior and pagina_posterior.

Replace this for:

<?php 
   for($i = 1; $i < $num_pagina + 1; $i++){ ?>
   <li><a href="http://www.arturluz.com/?pagina=<?php echo $i; ?>"><?php echo $i; ?></a></li>
 <?php } ?>

therefore:

<?php 
if($pagina > 2){
    echo "<li><span>...</span></li>"; // a partir da página 3 será necessário colocar os 3 pontos
}

if($pagina > 1)
echo "<li><a href='http://www.arturluz.com/?pagina=".$pagina_anterior."'>".$pagina_anterior."</a></li>";
echo "<li><a href='http://www.arturluz.com/?pagina=".$pagina."'>".$pagina."</a></li>";
if($pagina_posterior <= $num_pagina)
echo "<li><a href='http://www.arturluz.com/?pagina=".$pagina_posterior ."'>".$pagina_posterior."</a></li>";

if($pagina_posterior < $num_pagina){
    echo "<li><span>...</span></li>"; // se a próxima página for igual ultima página não será necessário colocar os 3 pontos
}
?>

Your code will look like this: (EDIT)

<?php 

$pagina = (isset($_GET['pagina'])) ? (int)$_GET['pagina'] : 1;

$sql_pagina = "SELECT * FROM posts";     
$result_pagina = $conexao->prepare($sql_pagina);
$result_pagina->execute();
$numTotal = $result_pagina->rowCount();

$quantidade = 5;

$num_pagina = ceil($numTotal/$quantidade);

$inicio = ($pagina * $quantidade) - $quantidade;
?>
...
código HMTL
...

<?php
$pagina_anterior = $pagina -1;
$pagina_posterior = $pagina + 1;
?>
<nav align="center" aria-label="Page navigation" class="nav-pagination" style="margin-bottom: 20px;">
<ul class="pagination">
   <li>
   <?php 
   if($pagina_anterior != 0) { ?>
      <a href="http://www.arturluz.com/?pagina=<?php echo $pagina_anterior; ?>" aria-label="Previous">
         <span aria-hidden="true">Anterior</span>
      </a>
   <?php } else { ?>
         <span aria-hidden="true">Anterior</span>
   <?php } ?>
   </li>
   <?php
        if($pagina > 2){
            echo "<li><span aria-hidden='true'>...</li>";
        }
        if($pagina > 1){
        echo "<li><a href='http://www.arturluz.com/?pagina=".$pagina_anterior."'>".$pagina_anterior."</a></li>";
        }
        echo "<li><a href='http://www.arturluz.com/?pagina=".$pagina."'>".$pagina."</a></li>";
        if($pagina_posterior <= $num_pagina){
            echo "<li><a href='http://www.arturluz.com/?pagina=".$pagina_posterior ."'>".$pagina_posterior."</a></li>"; 
        }
        if($pagina_posterior < $num_pagina){
            echo "<li><span aria-hidden='true'>...</li>";
        }
        ?>
   <li>
       <?php 
       if($pagina_posterior <= $num_pagina) { ?>
          <a href="http://www.arturluz.com/?pagina=<?php echo $pagina_posterior; ?>" aria-label="Previous">
             <span aria-hidden="true">Próximo</span>
          </a>
       <?php } else { ?>
          <span aria-hidden="true">Próximo</span>
        <?php } ?>
    </li>
</ul>
</nav>
  • Hello Andrei! I made the switch but the display looked something like this: Previous 1 2 Next ... Previous 1 2 3 Next ... Previous 2 3 4 Next ... Previous 3 4 Next ... . The three dots got off the bootstrap Nav.

  • @Rodrigosouzajesus I will check

  • 1

    @Rodrigosouzajesus check if your code matches the one I edited

  • put a <span> in the 3 dots

  • worked perfectly. As it is good to have help from people like you, thank you! Here is the result on the link http://www.arturluz.com/.

  • do you understand about url friendly? if yes, can send me your email?

Show 1 more comment

Browser other questions tagged

You are not signed in. Login or sign up in order to post.